» »

Мини чат в ajax окне для сайтов на uCoz

Мини чат в ajax окне для сайтов на uCoz

Отличное предложение для мини чата, который по клику будет по центру открываться в ajax окне, где все функций будут по умолчанию. Сейчас интернет ресурсы оригинальные по дизайн идут и чат не очень в них вписывается. И для этого можно его скрыть и в тоже время он будет на главной странице. Это виде кнопки или надписи. что можно сразу заменить, что не мало важно, если ресурс посещаемый, да и структура меняется, так как место в любом случай освободиться и там можно информер или рекламу установить.

Вид материала и форму добавление все выставляем по стандарту в админ панели. Здесь важна сама функциональность, есть много элементов или форме, что устанавливают в нижнее углы, но они все же заметны. А здесь совершенно не видно, и только по вызову может его вызвать. Можно что то вроде даже техподдержки сделать, чтоб быть в онлайн и быстро ответить.

Красивый мини чат с появлением по клику на сайте

Прикрепил кнопку на CSS, если она не нужна, то стили не ставим и класс с вызова убираем.

Это вызов на кнопке с классом, что за дизайн отвечает.

Это вызов на кнопке с классом, что за дизайн отвечает.
Код
<a class="zornet" href="javascript://" rel="nofollow" onclick="openchat();">Открыть мини-чат</a>


В низ сайта, там и размер по ширине и высоте выставляем.
Код
<script type="text/javascript">  
  function openchat(){new _uWnd('chat','Мини-чат',745,341,{align:0,shadow:0,close:1,autosize:1,maxh:745,minh:341,resize:0}, $("#chat").html() )}  
  </script>  
  <div style="display:none;" id="chat">$CHAT_BOX$</div>

CSS

Код
a.zornet {  
  display: inline-block;  
  color: white;  
  text-decoration: none;  
  padding: .5em 2em;  
  outline: none;  
  border-width: 3px 0;  
  border-style: solid none;  
  border-color: rgb(51, 175, 253) rgba(0, 0, 0, 0.99) rgba(6, 127, 215, 0.97);  
  border-radius: 5px;  
  background: linear-gradient(rgba(74, 172, 212, 0.99), rgba(22, 126, 227, 0.98)) rgba(22, 113, 227, 0.97);  
  transition: 0.2s;  
}  
a.zornet:hover {background: linear-gradient(rgba(58, 151, 187, 0.96), rgba(87, 153, 212, 0.96)) rgba(60, 142, 208, 0.97);}  
a.zornet:active { background: linear-gradient(rgba(0, 150, 245, 0.97), rgba(0, 134, 245, 0.96)) rgba(0, 130, 245, 0.98); }

Если вам понравилась ajax окне, то можете также в стили в CSS прописать.
28.10.2017 Просмотров: 357 Комментарий: (0)

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

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

Комментарий: 0
avatar