Сообщение оставлено 13.07.2011 в 14:31:35 | Сообщение #
1
Пользователь Пользователь проекта, который не имеет никаких привилегий.
К сожалению, пользователь контактные данные не указал.
К сожалению, пользователь данные о WMID не указал.
В нем есть: 1) Автообновление каждые 20 сек. 2) Возможность подгружать сообщения. 3) Красивое оформление )) 1. Настраиваем модуль "Мини-чат" по скрину: 2.Вид материалов чата заменяем на: Code
<div class="mch"> <div class="blockGbChat cBlock1"> <div style="float:left"> <a href="javascript:void('Apply to')" onclick="parent.window.document.getElementById('m_text').focus();parent.window.document.getElementById('m_text').value+='[i]$USERNAME$[/i], ';return false;"><b>$USERNAME$</b></a> </div> <div style="text-align:right" class="transparency"> <span title="$DATE$" style="color:grey;font-size:9px;">$TIME$</span> <a href="/index/8-$USER_ID$" target="_blank"><img src="http://webo4ka.ru/Ucoz4/mchat_user-icon.png" align="absmiddle" border="0"></a> </div> <div class="hrchat"></div> $MESSAGE$ </div> </div>
3.В шаблоне код $CHAT_BOX$ заменяем на: Code
<?if($USER_LOGGED_IN$)?> <div id="p_ml" style="display:none;z-index:102;position:absolute;background:white;opacity:0.9;height:270px;width:224px;"><br><br><br><br><br><br><br><br><br><br><center><img src="http://webo4ka.ru/Ucoz4/edit_mchat_mess_loading.gif"></center></div> <div id="chat_mess" style="overflow:scroll;overflow-x:hidden;height:270px;">Идёт загрузка..<br>Пожалуйста, подождите.</div><hr> <table border="0" cellpadding="1" cellspacing="1" width="100%"><tr><td width="95%" rowspan="2"><textarea id="m_text" placeholder="Текст Вашего сообщения.." onkeyup="cmlen();mlens();" onfocus="cmlen();mlens();" onblur="$('#mchatBtn').css({'background':''});"></textarea></td><td align="center" valign="top"><div style="font-size:10px;"><b id="m_len" style="color:#bdbdbd;">300</b></div><?ifnot($GROUP_ID$='12' or $GROUP_ID$='255')?><a href="javascript://" onclick="window.open('/mchat/0-1','mchatCtrl','scrollbars=1,width=550,height=550,left=0,top=0');return false;"><img style="margin-top:3px;" id="e_img" src="http://webo4ka.ru/Ucoz4/edit_mchat_mess.png" width="15" height="15"></a><?endif?></td></tr><tr><td align="center" valign="bottom" style="padding-bottom:2px;"><div style="width:30px"><input type="submit" onclick="m_post()" value="OK" class="mchat" id="mchatBtn" style="width:30px;"><img id="p_er" src="/.s/img/icon/er.png" style="display:none;margin-bottom:5px;"><img id="p_ok" src="/.s/img/icon/ok.png" style="display:none;margin-bottom:5px;"><img id="p_mli" src="http://webo4ka.ru/Ucoz4/mpload.gif" style="display:none;margin-bottom:5px;"></div></td></tr></table> <input type="text" id="cust1" style="display:none;"> <div class="pod_ewe2" onclick="window.location.href='http://webo4ka.ru/';">гуляю на webo4ka.ru</div> <?else?> <div class="no_mchat"><b>Доступ закрыт</b><br>Чтобы видеть сообщения, <b><a href="$LOGIN_LINK$" title="Вход">войдите</a></b>.</div> <?endif?> <script> $('#m_text').keydown(function(e){if(e.ctrlKey && e.keyCode == 13){$('#mchatBtn').click();}}); ldmess = function(){$('#p_ml').show();$('#chat_mess').html('<div class="pod_ewe" onclick="ldmess2()">Подгрузить ещё..</div>');$.get('/mchat/', function(data){var mesgs = $('div.mch:lt(20)', data).append();$('div#chat_mess').prepend(mesgs);});setTimeout(function(){$('#p_ml').hide();}, 700);};ldmess(); ldmess2 = function(){$('#p_ml').show();$('#chat_mess').html('');$.get('/mchat/', function(data){var mesgs = $('div.mch', data).append();$('div#chat_mess').prepend(mesgs);});setTimeout(function(){$('#p_ml').hide();}, 700);}; m_post = function(){ if($('#m_text').val().length<10){$('#mchatBtn').hide();$('#p_er').show();setTimeout(function(){$('#p_er').hide();$('#mchatBtn').fadeIn('fast');}, 1500);} else{$('#mchatBtn').hide();$('#p_ml').show();setTimeout(function(){ $.post('/mchat/', {numa: 0, a: 18, ajax: 1, mcmessage: $('#m_text').val(), custom1: $('#cust1').val()}, function(){$('#p_ml').hide();$('#p_ok').show();$('#m_text').val('');ldmess();setTimeout(function(){$('#p_ok').hide();$('#mchatBtn').fadeIn('fast');}, 1500);}); }, 1000); } }; mlens = function(){if($('#m_text').val().length<10){$('#mchatBtn').css({'background':'#fee4e3'});}else{$('#mchatBtn').css({'background':'#e6ffe3'});}}; function cmlen(){var rst = 300-$('#m_text').val().length;if (rst<0){rst=0;$('#m_text').val($('#m_text').val().substr(0,300));}$('#m_len').html(rst);}; setInterval(function(){ldmess()}, 20000); </script>
4. В CSS: Code
textarea#mchatMsgF {width:168px !important;} img#e_img{opacity:0.5;} img#e_img:hover{opacity:1.0;} div.pod_ewe{background:#f7f7f7;padding:6px;border:1px solid #ccc;margin-top:4px;} div.pod_ewe:hover{background:#fff;cursor:pointer;} div.pod_ewe2{opacity:0.7;background:#f7f7f7 url('http://webo4ka.ru/Ucoz4/1310277969_117893421.png') no-repeat right;padding:6px;border:1px solid #ddd;margin-top:4px;} div.pod_ewe2:hover{opacity:1.0;background:#fff url('http://webo4ka.ru/Ucoz4/1310277969_117893421.png') no-repeat right;cursor:pointer;} .blockGbChat{margin:5px 0px;padding:2px 6px;max-width:309px;overflow:hidden;} .cBlock1{border:1px solid #cfcfcf;background:#f8f8f8;} .transparency a img{opacity:0.7;filter:alpha(opacity=70);} .transparency a:hover img{opacity:1.0;filter:alpha(opacity=100);} .hrchat{height:1px;width:100%;background:white;border-top:1px solid #dddddd;margin:2px;} input#mchatBtn{background:#f8f8f8;border:1px solid #dddddd;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding:3px;} input#mchatBtn:hover{background:#fff;border:1px solid #cfcfcf;cursor:pointer;} input#mchatBtn:focus{border:1px solid #bdbdbd;} textarea#m_text{resize:none;background:#fbfbfb;border:1px solid #dddddd;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding:3px;} textarea#m_text:hover{background:#fff;border:1px solid #cfcfcf;-moz-box-shadow:0px 0px 5px #bdbdbd inset;box-shadow:0px 0px 5px #bdbdbd inset;-webkit-box-shadow:0px 0px 5px #bdbdbd inset;} textarea#m_text:focus{border:1px solid #bdbdbd;-moz-box-shadow:0px 0px 5px #bdbdbd inset;box-shadow:0px 0px 5px #bdbdbd inset;-webkit-box-shadow:0px 0px 5px #bdbdbd inset;} .no_mchat{margin:4px;padding:4px;border:2px solid #dddddd;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;color:#cc6a6a;}
Сообщение оставлено 13.07.2011 в 14:31:35 | Сообщение #
1
Ребенок моё счастье
Сообщения: 2324
В нем есть: 1) Автообновление каждые 20 сек. 2) Возможность подгружать сообщения. 3) Красивое оформление )) 1. Настраиваем модуль "Мини-чат" по скрину: 2.Вид материалов чата заменяем на: Code
<div class="mch"> <div class="blockGbChat cBlock1"> <div style="float:left"> <a href="javascript:void('Apply to')" onclick="parent.window.document.getElementById('m_text').focus();parent.window.document.getElementById('m_text').value+='[i]$USERNAME$[/i], ';return false;"><b>$USERNAME$</b></a> </div> <div style="text-align:right" class="transparency"> <span title="$DATE$" style="color:grey;font-size:9px;">$TIME$</span> <a href="/index/8-$USER_ID$" target="_blank"><img src="http://webo4ka.ru/Ucoz4/mchat_user-icon.png" align="absmiddle" border="0"></a> </div> <div class="hrchat"></div> $MESSAGE$ </div> </div>
3.В шаблоне код $CHAT_BOX$ заменяем на: Code
<?if($USER_LOGGED_IN$)?> <div id="p_ml" style="display:none;z-index:102;position:absolute;background:white;opacity:0.9;height:270px;width:224px;"><br><br><br><br><br><br><br><br><br><br><center><img src="http://webo4ka.ru/Ucoz4/edit_mchat_mess_loading.gif"></center></div> <div id="chat_mess" style="overflow:scroll;overflow-x:hidden;height:270px;">Идёт загрузка..<br>Пожалуйста, подождите.</div><hr> <table border="0" cellpadding="1" cellspacing="1" width="100%"><tr><td width="95%" rowspan="2"><textarea id="m_text" placeholder="Текст Вашего сообщения.." onkeyup="cmlen();mlens();" onfocus="cmlen();mlens();" onblur="$('#mchatBtn').css({'background':''});"></textarea></td><td align="center" valign="top"><div style="font-size:10px;"><b id="m_len" style="color:#bdbdbd;">300</b></div><?ifnot($GROUP_ID$='12' or $GROUP_ID$='255')?><a href="javascript://" onclick="window.open('/mchat/0-1','mchatCtrl','scrollbars=1,width=550,height=550,left=0,top=0');return false;"><img style="margin-top:3px;" id="e_img" src="http://webo4ka.ru/Ucoz4/edit_mchat_mess.png" width="15" height="15"></a><?endif?></td></tr><tr><td align="center" valign="bottom" style="padding-bottom:2px;"><div style="width:30px"><input type="submit" onclick="m_post()" value="OK" class="mchat" id="mchatBtn" style="width:30px;"><img id="p_er" src="/.s/img/icon/er.png" style="display:none;margin-bottom:5px;"><img id="p_ok" src="/.s/img/icon/ok.png" style="display:none;margin-bottom:5px;"><img id="p_mli" src="http://webo4ka.ru/Ucoz4/mpload.gif" style="display:none;margin-bottom:5px;"></div></td></tr></table> <input type="text" id="cust1" style="display:none;"> <div class="pod_ewe2" onclick="window.location.href='http://webo4ka.ru/';">гуляю на webo4ka.ru</div> <?else?> <div class="no_mchat"><b>Доступ закрыт</b><br>Чтобы видеть сообщения, <b><a href="$LOGIN_LINK$" title="Вход">войдите</a></b>.</div> <?endif?> <script> $('#m_text').keydown(function(e){if(e.ctrlKey && e.keyCode == 13){$('#mchatBtn').click();}}); ldmess = function(){$('#p_ml').show();$('#chat_mess').html('<div class="pod_ewe" onclick="ldmess2()">Подгрузить ещё..</div>');$.get('/mchat/', function(data){var mesgs = $('div.mch:lt(20)', data).append();$('div#chat_mess').prepend(mesgs);});setTimeout(function(){$('#p_ml').hide();}, 700);};ldmess(); ldmess2 = function(){$('#p_ml').show();$('#chat_mess').html('');$.get('/mchat/', function(data){var mesgs = $('div.mch', data).append();$('div#chat_mess').prepend(mesgs);});setTimeout(function(){$('#p_ml').hide();}, 700);}; m_post = function(){ if($('#m_text').val().length<10){$('#mchatBtn').hide();$('#p_er').show();setTimeout(function(){$('#p_er').hide();$('#mchatBtn').fadeIn('fast');}, 1500);} else{$('#mchatBtn').hide();$('#p_ml').show();setTimeout(function(){ $.post('/mchat/', {numa: 0, a: 18, ajax: 1, mcmessage: $('#m_text').val(), custom1: $('#cust1').val()}, function(){$('#p_ml').hide();$('#p_ok').show();$('#m_text').val('');ldmess();setTimeout(function(){$('#p_ok').hide();$('#mchatBtn').fadeIn('fast');}, 1500);}); }, 1000); } }; mlens = function(){if($('#m_text').val().length<10){$('#mchatBtn').css({'background':'#fee4e3'});}else{$('#mchatBtn').css({'background':'#e6ffe3'});}}; function cmlen(){var rst = 300-$('#m_text').val().length;if (rst<0){rst=0;$('#m_text').val($('#m_text').val().substr(0,300));}$('#m_len').html(rst);}; setInterval(function(){ldmess()}, 20000); </script>
4. В CSS: Code
textarea#mchatMsgF {width:168px !important;} img#e_img{opacity:0.5;} img#e_img:hover{opacity:1.0;} div.pod_ewe{background:#f7f7f7;padding:6px;border:1px solid #ccc;margin-top:4px;} div.pod_ewe:hover{background:#fff;cursor:pointer;} div.pod_ewe2{opacity:0.7;background:#f7f7f7 url('http://webo4ka.ru/Ucoz4/1310277969_117893421.png') no-repeat right;padding:6px;border:1px solid #ddd;margin-top:4px;} div.pod_ewe2:hover{opacity:1.0;background:#fff url('http://webo4ka.ru/Ucoz4/1310277969_117893421.png') no-repeat right;cursor:pointer;} .blockGbChat{margin:5px 0px;padding:2px 6px;max-width:309px;overflow:hidden;} .cBlock1{border:1px solid #cfcfcf;background:#f8f8f8;} .transparency a img{opacity:0.7;filter:alpha(opacity=70);} .transparency a:hover img{opacity:1.0;filter:alpha(opacity=100);} .hrchat{height:1px;width:100%;background:white;border-top:1px solid #dddddd;margin:2px;} input#mchatBtn{background:#f8f8f8;border:1px solid #dddddd;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding:3px;} input#mchatBtn:hover{background:#fff;border:1px solid #cfcfcf;cursor:pointer;} input#mchatBtn:focus{border:1px solid #bdbdbd;} textarea#m_text{resize:none;background:#fbfbfb;border:1px solid #dddddd;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding:3px;} textarea#m_text:hover{background:#fff;border:1px solid #cfcfcf;-moz-box-shadow:0px 0px 5px #bdbdbd inset;box-shadow:0px 0px 5px #bdbdbd inset;-webkit-box-shadow:0px 0px 5px #bdbdbd inset;} textarea#m_text:focus{border:1px solid #bdbdbd;-moz-box-shadow:0px 0px 5px #bdbdbd inset;box-shadow:0px 0px 5px #bdbdbd inset;-webkit-box-shadow:0px 0px 5px #bdbdbd inset;} .no_mchat{margin:4px;padding:4px;border:2px solid #dddddd;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;color:#cc6a6a;}