Приветствую Вас, Гость | RSS
Суббота, 11.05.2024, 19:11
Главная » Файлы » uCoz » Скрипты

Мини-чат by укозик v 1.0 Ucoz
23.04.2012, 16:10

В сети довольно так и много различных версий мини-чата. Возможно подобная версия чата уже есть, лично я пока не встречал. Чат также разрабатывался для "укозик" и я решил им поделиться. Что хочется про него сказать, мини-чат плавно раскрывается и скрывается при нажатии на кнопку находящуюся с боку. Фону предана прозрачность. Регулируйте ее под себя (если светлый фон, то желательно малость убавить)

Установка:

После < /head>:
Code
<script type="text/javascript" src="http://xn--g1acecr2a.xn--p1ai/avtorstvo/scripts/jquery-ui-1.8.custom.min.js"></script><script type="text/javascript" src="http://xn--g1acecr2a.xn--p1ai/avtorstvo/scripts/mini-chat.js"></script>

В CSS:
Code
#miniChat{  
  display:none;  
  position:realitive;  
  position:fixed;  
  bottom:73px;  
  background-color:#000;  
  width:250px;  
  height:410px;  
  border-top:1px solid #fff;  
  border-right:1px solid #fff;  
  border-bottom:1px solid #fff;  
  border-radius:0 7px 0 0;  
  background: rgba(0, 0, 0, 0.7);  
  z-index:1;  
  }  
   
  #chatCont{  
  position:absolute;  
  z-index:2;  
  width:240px;  
  height:380px;  
  margin:10px 10px 10px 0;  
  color:#999;  
  }  

  #chat{  
  position:absolute;  
  position:fixed;  
  bottom:73px;  
  cursor:pointer;  
  width:40px;  
  height:38px;  
  z-index:1;  
  }  

  .chatH{margin-left:-3px;}  
   
  .chatH:hover{margin-left:0px;}  
  /*endchat*/[code]  

  Вид материалов мини-чата:  

  [code]<style type="text/css">  
  .vBlock1{  
  border: 1px solid #333333;  
  color:#15ADFF;  
  }  
   
  .vBlock1 a:link{color:#999999;}  
  .vBlock1 a:visited{color:#999999;}  
  .vBlock1 a:hover{color:#DF8404;}  
  .vBlock1 a:active{color:#999999;}  
   
  .vBlock2{  
  border: 1px solid #3B3B3B;  
  color:#999999;  
  }  

  .vBlock2 a:link{color:#ffffff;}  
  .vBlock2 a:visited{color:#ffffff;}  
  .vBlock2 a:hover{color:#DF8404;}  
  .vBlock2 a:active{color:#ffffff;}  
  </style>  
  <div class="vBlock$PARITY$" 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://s105.ucoz.net/img/icon/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>

Форма добавления сообщений мини-чата:
Code
<style type="text/css">  
  #jeuwu28{  
  color:#999999;  
  }  
  #mchatMsgF {  
  margin:0;  
  padding: 8px 10px;  
  font-size:16px;  
  color:#b3b3b3;  
  border:solid 1px #585858;  
  text-shadow: 1px 1px 0 #4b4b4b;  
  border-radius: 10px 10px;  
  -moz-border-radius: 10px 10px;  
  -webkit-border-radius: 10px 10px;  
  box-shadow: inset 1px 1px 3px 0 #000;  
  -moz-box-shadow: inset 1px 1px 3px 0 #000;  
  -webkit-box-shadow: inset 1px 1px 3px 0 #000;  
  background:-moz-linear-gradient(0% 100% 90deg,#7e7e7e, #5e5e5e);  
  background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#5e5e5e), to(#7e7e7e));  
  }  
  #mchatBtn {  
  width:auto;  
  border:solid 1px #bababa;  
  color:#363636;  
  font-weight:bold;  
  font-size:10px;  
  border-bottom-color:#363636;  
  background:-moz-linear-gradient(0% 100% 90deg,#5f5f5f, #9e9e9e);  
  background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#9e9e9e), to(#5f5f5f));  
  box-shadow: none;  
  -moz-box-shadow: none;  
  -webkit-box-shadow: none;  
  text-shadow: 1px 1px 0 #9d9d9d;  
  border-radius: 3px ;  
  -moz-border-radius: 3px;  
  -webkit-border-radius: 3px;  
  }  
  #mchatBtn:hover {color:#ffffff;  
  cursor:pointer;}  
  #mchatRSel{  
  box-shadow: inset 1px 1px 3px 0 #000;  
  -moz-box-shadow: inset 1px 1px 3px 0 #000;  
  -webkit-box-shadow: inset 1px 1px 3px 0 #000;  
  border: none;  
  background:-moz-linear-gradient(0% 100% 90deg,#5f5f5f, #9e9e9e);  
  background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#9e9e9e), to(#5f5f5f));  
  color:#ffffff;  
  }  

  #mchatMsgF{height:55px!important;}  
.pfe{margin-top:40px;}
  </style>  
  <div align="center"><div class="pfe"><a href="$LOGIN_LINK$">Для добавления необходима авторизация</a></div>Доступ запрещен</div>  
  <table border="0" cellpadding="1" cellspacing="1" width="100%">  
  <tr><td>$FLD_AUTOUPD$</td>  
  <td width="70%" align="right">  
  <a href="$RELOAD_URI$" title="Обновить"><img alt="" border="0" align="absmiddle" src="http://xn--g1acecr2a.xn--p1ai/dz/mchat/ob.png" width="13" height="15"></a>  
  <a href="$SMILES_URI$" title="Вставить смайл"><img alt="" border="0" align="absmiddle" src="http://xn--g1acecr2a.xn--p1ai/dz/mchat/s.png" width="13" height="13"></a>  
  <a href="$BBCODES_URI$" title="BB-Коды"><img alt="" border="0" align="absmiddle" src="http://xn--g1acecr2a.xn--p1ai/dz/mchat/b.png" width="13" height="15"></a>  
  <a href="$MSGCTRL_URI$" title="Управление сообщениями"><img alt="" border="0" align="absmiddle" src="http://xn--g1acecr2a.xn--p1ai/dz/mchat/n.png" width="15" height="15"></a>  
  </td></tr></table>  

   
  <table border="0" cellpadding="1" cellspacing="1" width="100%">  
  <tr><td colspan="2">$FLD_NAME$</td></tr>  
  <tr><td width="50%">$FLD_EMAIL$</td><td>$FLD_URL$</td></tr>  
  </table>  
   

   
  <table border="0" cellpadding="1" cellspacing="1" width="100%">  
  <tr><td width="50%">$FLD_CUSTOM1$</td><td>$FLD_CUSTOM2$</td></tr>  
  </table>  
   

   
  <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="180px" rowspan="2">$FLD_MESSAGE$</td>  
  <td align="center" valign="top"><div style="font-size:12px;">$LENGTH_COUNTER$</div></td>  
  </tr><tr><td width="50px" align="center" valign="bottom">$SUBMIT$</td></tr></table>  
  

В шаблон сайта после < body>:
Code
<div id="miniChat">
<div id="chatCont"><div id="chatHe">$CHAT_BOX$</div></div>
</div>
<div id="chat" class="chatH"><span id="chats"><img src="http://xn--g1acecr2a.xn--p1ai/dznew/mini-chat4.png" border="0" alt="Мини чат"></span></div>

Готово!
Категория: Скрипты | Добавил: ruslan | Теги: Мини-чат, by, 1.0, укозик
Просмотров: 743 | Загрузок: 0 | Рейтинг: 1.0/1
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Copyright MyCorp © 2024 |