MENU
Главная » Шаблоны и Скрипты для uCoz » Скрипты для uCoz » Мини чат для uCoz

Простой мини-чат для uCoz

31.05.2015, 20:45
Простой мини-чат для uCoz. Ну я могу сказать что это обычный мини-чат, он довольно оригинальный, подходит под любой дизайн сайта. Этот мини-чат содержит аккуратную форму добавления сообщений.

Установка:
1.В Вид мини-чата:

Код
<div class="b_blog">  
  <div class="chat_title">  
  <div class="chat_titlel"> <a href="javascript:void('Apply to')" onclick="parent.window.document.getElementById('mchatMsgF').focus();parent.window.document.getElementById('mchatMsgF').value+='[i]$USERNAME$[/i], ';return false;">$USERNAME$</a></div>  
  <div class="chat_titler">$DATE$, $TIME$</div>  
  </div>  
  <div class="chat_cont">$MESSAGE$ </div>  
  <div class="chat_patt"></div>  
  </div>

2. В Форму добавления сообщения:
Код
<?if(!$CAN_ADD$)?><div align="center"><?if($LOGIN_LINK$)?><a href="$LOGIN_LINK$">Для добавления необходима авторизация</a><?else?>Доступ запрещен<?endif?></div><?else?>  
  <?if($FLD_SECURE$)?>  
  <table border="0" cellpadding="1" cellspacing="1" width="100%">  
  <tr><td width="50%">$FLD_SECURE$</td><td align="right">$IMG_SECURE$</td></tr>  
  </table>  
  <?endif?>  

  <textarea name="mcmessage" class="mchat" id="mchatMsgF" title="Сообщение" onkeyup="countMessLength();" onfocus="countMessLength();" style="resize:none;"></textarea>  

  <div class="chat_panel">  
  <ul>  

  <li><a href="javascript:void('Apply to')" onclick="parent.window.document.getElementById('mchatMsgF').focus();parent.window.document.getElementById('mchatMsgF').value+='[b]Ваше слово[/b] ';return false;" id="mchatBtn"><b>B</b></a></li>  
  <li><a href="javascript:void('Apply to')" onclick="parent.window.document.getElementById('mchatMsgF').focus();parent.window.document.getElementById('mchatMsgF').value+='[i]Ваше слово[/i] ';return false;" id="mchatBtn"><i>i</i></a></li>  
  <li><a href="javascript:void('Apply to')" onclick="parent.window.document.getElementById('mchatMsgF').focus();parent.window.document.getElementById('mchatMsgF').value+='[u]Ваше слово[/u] ';return false;" id="mchatBtn"><u>U</u></a></li>  

  <li><a href="javascript://" rel="nofollow" onclick="new _uWnd('Sml',' ',-250,-350,{autosize:0,closeonesc:1,resize:0},{url:'/index/35-1-2'});return false;"><img style="padding-top:6px" src="http://ucozup.ru/files_ucozup/kopete020.png" width="12" height="12"></a></li>  

  <li><input type="submit" value="Отправить" class="mchat" id="mchatBtn" alt="" style="padding:1px 6px 0 3px;"></li>  

  </ul>  
  </div>  
  <input type="hidden" name="numa" id="numa832" value="0"><input type="hidden" name="a" value="18"><input type="hidden" id="ajaxFlag" name="ajax" value="1" />  
  <?endif?>

3. И в таблицу Стилей CSS добавляем этот код:
Код
.b_blog {overflow:hidden; width:173px; margin:0 0 4px 1px;}  
  .chat_title {background:url(/minichat/chat_title.png) no-repeat; width:173px; height:20px; font:10px Tahoma; color:#383838;}  
  .chat_titlel {background:#fff; border-radius:3px; margin:3px; padding:1px 2px; float:left;}  
  .chat_titlel a {color:black;}  
  .chat_titlel a:hover {text-decoration:none;}  
  .chat_titler {background:#fff; border-radius:3px; margin:3px; padding:1px 2px; float:right;}  
  .chat_cont {overflow:hidden; font:11px Tahoma; color:#383838; width:169px; padding:2px;}  
  .chat_cont a {color:#383838; text-decoration:none;}  
  .chat_patt {background:url(/minichat/chat_patt.png) no-repeat; width:173px; height:3px; margin:0 auto;}  
  #mchatMsgF {background:url(/minichat/chat_mess.png) no-repeat; width:184px; height:52px; padding:7px; color:#8a8a8a; font:10px Tahoma; border:none; outline:none;}  
  .chat_panel {background:url(/minichat/chat_panel.png) no-repeat; width:184px; height:23px;}  
  .chat_panel ul {display:block; height:23px;}  
  .chat_panel ul li {background:url(/minichat/chat_line.png) no-repeat right; padding:0 0 0 2px; float:left; height:23px; line-height:23px;}  
  .chat_panel ul li:hover {background:#759141;}  
  .chat_panel ul li a {color:#fff; padding:0 8px 0 5px;}  
  .chat_panel ul li a:hover {text-decoration:none;}  
  #mchatBtn {background:none; line-height:23px; font-weight:bold;}  

  .scroll-pane {height:230px; padding:0 0 0 10px; margin:0 5px 4px 0; overflow:auto; outline:none;}  
  .jspContainer {width:100% !important;position: relative; overflow: hidden; outline:0; z-index: 1;}  
  .jspTrack {height:100%; position: absolute; cursor: pointer; right:6px; top:0; overflow:hidden; z-index:22;}  
  .jspDrag {width:4px; border-radius:10px; overflow: hidden; position: relative; top: 0; left:8px; background:url(/minichatchat_scroll.png) no-repeat -8px center; cursor: pointer; }  
  .jspDragTop {border-radius:10px 10px 0 0; width:4px; height:14px; position: absolute; top: 0; left: 0; overflow: hidden; background:url(/minichat/chat_scroll.png) no-repeat 0 top; }  
  .jspDragBottom {border-radius:0 0 10px 10px; width:4px; height:14px; position: absolute; bottom: 0; left: 0; overflow: hidden; background:url(/minichat/chat_scroll.png) no-repeat -4px bottom; }  
  .jspPane { width:196px !important;padding:0 !important; position: absolute; }  
  .jspVerticalBar {width: 12px; height: 100%; position: absolute; top:0px; right: 0; }  
  .jspHorizontalBar { width: 100%; height: 10px; position: absolute; bottom: 0; left: 0;}  
  .jspVerticalBar *, .jspHorizontalBar * { margin: 0; padding: 0; }  
  .jspCap { display: none; }  
  .jspHorizontalBar .jspCap { float: left; }  
  .jspTrack { position: relative;}  
  input[type="button"], input[type="submit"], input[type="reset"] {background:url(/minichat/forum_butt.png) no-repeat left 0,url(/minichat/forum_butt.png) no-repeat right -40px,url(/minichat/forum_butt.png) repeat-x 0 -20px; height:20px; display:inline-block; border-radius:6px; color:#fff; padding:0 5px 1px; text-shadow:1px 1px #394c14; font:11px Tahoma; border:none;}  
  input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover {background:url(/minichat/forum_butt_hover.png) no-repeat left 0,url(/minichat/forum_butt_hover.png) no-repeat right -40px,url(/minichat/forum_butt_hover.png) repeat-x 0 -20px; height:20px; display:inline-block; border-radius:6px; cursor:pointer;}
Категория: Мини чат для uCoz | Добавил: Slavik | Теги: мини-чат, простой, ucoz, для
Просмотров: 472 | Загрузок:19 Скачать (62.1 Kb)






Всего комментариев: 0
Оставить свой комментарий

Используются технологии uCoz