Оригинальный Мини-чат в ajax окне в стиле ucoz
В интернете много можно найти всяких мини-чат в ajax под различный дизайн и чтоб он просто при наведение открывался. Но этот чат немного другой. Но во первых он полностью переделан и как видите все функций находятся на верху что очень оригинально и для таких типов чата очень удобно. Ставить кнопку это вам решать и по вашему сайту. Можно поставить с боку так же с низу. Вообщем куда вам нужно или как подскажет фантазия. Так же в чате показывает время кто когда отписался, думаю сделано для дизайна просто смотрится красиво. Но и для дело, видно человек когда написал и нужно ли давать ответ если написано несколько дней назад, но это вам решать. Вообщем что еще хочется сказать, думаю если на сайте много блоков то такой мини чат просто необходим. Или вы просто хотите создать полностью оригинальный портал со своими фишками, думаю эта скажем фишка не помешает вашему дизайн сайту, а главное полностью в рабочем состояние. Приступаем к установке: 1) Вставляем данный код перед это важно то не будет работать. Код <script type="text/javascript"> function mchat_webo4ka_ru(){new _uWnd('mchat','Мини-чат',300,100,{onclose:function(){content: 'onclick="_uWnd.close(\'Sml\')"'},customButtons: {'ypravlenie_cmc': [true, function (){new _uWnd("cmc","Управление сообщениями",340,340,{x: _uWnd.getdims().clientW - 353, y: _uWnd.getdims().clientH - 353, customButtons: {'obnoviti': [true, function (){new _uWnd("cmc","Управление сообщениями",340,340,{x: _uWnd.getdims().clientW - 353, y: _uWnd.getdims().clientH - 353,},'<iframe src="/mchat/0-1" height="290px"></iframe>');}]}, alert: 1, autosize: 1, fixed: 1, resize: 0, fadetype: 1, fadespeed: 400, fadeclosetype: 1, fadeclosespeed: 400,},'<iframe src="/mchat/0-1" height="290px"></iframe>');}], 'bb-kodi': [true, function (){new _uWnd('bb-kodi','BB-коды',600,600,{autosize:0,closeonesc:1,resize:0},'<iframe src="http://scales.3dn.ru/index/17" width="550px" height="550px"></iframe>');}], 'smaili': [true, function (){new _uWnd('Sml',' ',-250,-350,{x: _uWnd.getdims().clientW - 1100, y: _uWnd.getdims().clientH - 628, autosize:0,closeonesc:1,resize:0},{url:'/index/35-2-2'});return false;}], 'obnoviti': [true,function(){mchat_webo4ka_ru()}], }, autosize: 1, resize: 1, min: 1, max: 1, fadetype: 1, fadespeed: 400, fadeclosetype: 1, fadeclosespeed: 400,}, $("#mchat_webo4ka_ru").html() )} $("body").append("<style type=\"text\/css\">.xt-obnoviti{background-position:0 -225px;} .xt-obnoviti-over{background-position:-15px -225px;}<\/style>"); $("body").append("<style type=\"text\/css\">.xt-smaili{background-position:0 -90px;} .xt-smaili-over{background-position:-15px -90px;}<\/style>"); $("body").append("<style type=\"text\/css\">.xt-bb-kodi{background-position:0 -135px;} .xt-bb-kodi-over{background-position:-15px -135px;}<\/style>"); $("body").append("<style type=\"text\/css\">.xt-ypravlenie_cmc{background-position:0 -315px;} .xt-ypravlenie_cmc-over{background-position:-15px -315px;}<\/style>"); </script> <div style="display:none;" id="mchat_webo4ka_ru">$CHAT_BOX$</div> 2) Тут это код нужно прописать как говорил как вам угодно и под ваш сайт. Код <a href="#" onclick="mchat_webo4ka_ru();">Мини-чат</a> 3) Вид материалов заменяем на это Код <div class="xw-tl"><div class="xw-tr"><div class="xw-tc xw-tsps"></div></div></div><div class="xw-ml"><div class="xw-mr"><div class="xw-mc menuBg" style="background-color:#ffffff;"> <div style="padding:0 4px 5px 2px;margin-bottom:3px;"> <div style="float:right;font-size:8px;" title="$DATE$">$TIME$</div> <div style="text-align:left;"> <a href="$PROFILE_URL$" title="$USERNAME$" rel="nofollow"><img alt="" src="http://zornet.ru/CSS-ZORNET/ZER/profile.png" width="13" border="0" style="vertical-align:-2px"/></a> <a href="javascript:void('Apply to')" onclick="parent.window.document.getElementById('mchatMsgF').focus();parent.window.document.getElementById('mchatMsgF').value+='[i]$NAME$[/i], ';return false;"><b>$NAME$</b></a> <a href="$EMAIL_JS$" title="$STR_EMAIL$">E</a> <a rel="nofollow" href="$SITE$" target="_blank" title="$STR_URL$">W</a> </div> <div class="cMessage" style="text-align:left;">$MESSAGE$</div> <br>$STR_CUSTOM1$: $CUSTOM1$ <br>$STR_CUSTOM2$: $CUSTOM2$ </div> </div></div></div><div class="xw-bl"><div class="xw-br"><div class="xw-bc"><div class="xw-footer"></div></div></div></div> <link id="link_layer" type="text/css" rel="stylesheet" href="http://zornet.ru/CSS-ZORNET/ZER/layer3.css" /> <br> 4) Форму добавления сообщения меняете на это Код <div class="xw-tl"><div class="xw-tr"><div class="xw-tc xw-tsps"></div></div></div><div class="xw-ml"><div class="xw-mr"><div class="xw-mc menuBg" style="background-color:#ffffff;"> <div align="center"><a href="$LOGIN_LINK$">Для добавления необходима авторизация</a>Доступ запрещен</div> </div></div></div><div class="xw-bl"><div class="xw-br"><div class="xw-bc"><div class="xw-footer"></div></div></div></div> <div class="xw-tl"><div class="xw-tr"><div class="xw-tc xw-tsps"></div></div></div><div class="xw-ml"><div class="xw-mr"><div class="xw-mc menuBg" style="background-color:#ffffff;"> <table border="0" cellpadding="1" cellspacing="1" width="100%"> <tr><td width="50%">$FLD_SECURE$</td><td align="right">$IMG_SECURE$</td></tr> </table> <table border="0" cellpadding="1" cellspacing="1" width="100%"> <tr><td width="95%" rowspan="2">$FLD_MESSAGE$</td> <td align="center" valign="top"><div style="font-size:10px;">$LENGTH_COUNTER$</div></td> </tr><tr><td align="center" valign="bottom">$SUBMIT$</td></tr></table> </div></div></div><div class="xw-bl"><div class="xw-br"><div class="xw-bc"><div class="xw-footer"></div></div></div></div> На этом все мини чат установлен. |
Поделиться в социальных сетях
Материал разместил
Комментарии: 3 | |
| |