» »

Мини чат для сайта VER выдвижной


Этот мини чат полностью рабочий. И он может работать на главной страницы, а вот на форуме его вы уже не увидите. Основном он сделан, если все блоки на сайте задействованы и нету места под чат.
Работает очень просто, с правой стороны стоит картинка с подписью мини чат. Вы ее нажимаете и сам чат выезжает их низа сайта. Пишите что надо и обратно нажимает и он заезжает.
Вот в этом он очень удобен. Но во первых он не мешает и не занимает место. Во вторых, кому нужно что то написать он увидит безусловно где что писать.
Все проверено на тестовом сайте и все картинки что в этом топе с него.

С начало так в спокойном режиме.


Когда открывается можете увидеть на главном скриншоте.
Копируем и вставляем в самый низ сайта:
Код
<style>  
  .chat_box {display:none;position:fixed;bottom:15px;right:15px;border:1px solid #dddddd;background:#fbfbfb;padding:4px;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;-moz-box-shadow:2px 2px 3px #9b9b9b;-webkit-box-shadow:2px 2px 3px #9b9b9b;box-shadow:2px 2px 3px #9b9b9b;}  
  .chat_box div.close {display:block;position:absolute;right:0;top:0;background:url('http://zornet.ru/CSS-ZORNET/TR/chat_box_closeprofil.png') no-repeat;width:16px;height:16px;opacity:0.6;-moz-opacity:0.6;filter:alpha(opacity=60);filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);}  
.chat_box div.close:hover {cursor:pointer;opacity:1.0;-moz-opacity:1.0;filter:alpha(opacity=100);filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);}  
   
  div.chat_button {display:block;width:75px;height:75px;background:url('http://zornet.ru/CSS-ZORNET/TR/chat_button_prifil.png') no-repeat;position:fixed;bottom:15px;right:15px;opacity:0.8;-moz-opacity:0.8;filter:alpha(opacity=80);filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);}  
div.chat_button:hover {cursor:pointer;opacity:1.0;-moz-opacity:1.0;filter:alpha(opacity=100);filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);}  
</style> <script src="http://zornet.ru/CSS-ZORNET/TR/table.js" type="text/javascript"></script>  
<div class="chat_button" onclick="$('.chat_button').fadeOut('fast');$('.chat_box').slideToggle('slow');"></div>  
<div class="chat_box"><div class="close" onclick="$('.chat_box').slideToggle('fast');$('.chat_button').fadeIn('slow');"></div>  
<div id="chatBox">$CHAT_BOX$</div>  
</div>
18.03.2014 Просмотров: 823 Комментарий: (4)

Поделиться в социальных сетях

Материал разместил

Комментарий: 2
Kosten
Kosten 18.03.2014 12:351
0
ALEX14-88, не знаю где ты написал что не работает. Пришлось проверить. Итог, это рабочий чат и второе, тебе надо немного учить систему ucoz.
Kosten
Kosten 18.03.2014 15:042
0
Scorpion, да просто надоедает. Да бывает случается что то не работает. Битая ссылка ИТД. Но здесь все не работает пишет.. приходиться перепроверять.
avatar