ZorNet.Ru — сайт для вебмастера » Скрипты для uCoz » Мини чат в темном дизайне для сайта uCoz

Мини чат в темном дизайне для сайта uCoz

Оригинальный по своему дизайну мини чат для сайта uCoz, который предназначен для вывода сообщений на главной страницы, и выполнен на HTML + CSS. По своему стилю он отличается от других форматах, так как здесь намного больше задействовано оттенков цвета. Если синий идет под ник пользователя, где в самом низу вписана горизонтальная линия. То по другую сторону можно наблюдать аналогичный ход с линией, только уже в алом оттенке, где по вверх можно наблюдать, какое сообщение оставлено по времени.

И основная форма для написания постов или выставление смайлов, так как изначально мы оставляем форме добавление, то здесь более-менее в стандартном режиме. Но все так выстроено по стилистике, где вы самостоятельно можете кардинально поменять всю структурную форму. Ведь нужно заметить, что кнопки стандарт, что можно редка в части встретить, но главное они строго под формой поставлены. Как добавление ответа или обновление, и если нужно то вывести смайлы с bb кодами.

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

Красивый мини чат для сайтов юкоз

Вид материала:

Код

Форма добавление:

Код

<?if($USER_LOGGED_IN$)?>
<div class="bchat_add">
<div class="bb-editor_chat">
<div class="clr"></div><br/>
<textarea id="mchatMsgF" name="mcmessage"></textarea>
</div></div>
<br>
<div class="bc_bot">
<?if($BBCODES_URI$)?><a href="$BBCODES_URI$" title="BB-Коды"><input class="fbutton" style="font-size: 11px; float: left; margin:0 5px 0 6px;" title="BB code" type="button" value="BB" /> </a><?endif?>

<input type="submit" class="fbutton" id="mchatBtn" style="font-size: 11px;margin-right: 5px; float: right;" title="Send" value="OK" /><img alt="" style="display:none;" id="mchatAjax" src="http://s17.ucoz.net/img/fr/ajax3.gif" border="0" width="16">

  <?if($MSGCTRL_URI$)?><a href="$MSGCTRL_URI$" title="Управление сообщениями"><input class="fbutton" style="font-size: 11px;margin-right: 5px; float: left;" title="Settings" type="submit" id="mchatBtn" value="Settings" /> </a><?endif?>
<?if($SMILES_URI$)?><a href="$SMILES_URI$" title="Смайлы"><input class="fbutton" style="font-size: 11px; float: left;" title="Settings" type="submit" id="mchatBtn" value="Смайлы" /> </a><?endif?>
<?if($FLD_SECURE$)?>--><br><br><table><tbody><tr><td>$FLD_SECURE$<span style="margin-top:-2px; margin-left:4px;">$IMG_SECURE$</span></td></tr></tbody></table><?endif?>
<div class="clr"></div>

  </div>
  <?else?>

<br/>
<div class="error-block" style="width:70%; margin: 0 0 -10px 12px;">
<b>Вы не можете писать сообщения.</b>

</div>
<?endif?>



<style>

#mchatMsgF {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 2px;
  font-family: 'NeoSansCyr-Regular', sans-serif;
  margin: 0px 4px;
  background: #252b33;
  height: 57px;
  width: 97%;
  border: none;
  border-radius: 3px;
  resize: none;
}

  ::-webkit-scrollbar
  {
  width: 7px;
  height: 7px;
  }
  ::-webkit-scrollbar-track-piece
  {
  background-color: #161616;
  -webkit-border-radius: 5px;
  }
  ::-webkit-scrollbar-thumb:vertical
  {
  height: 5px;
  /*background-color: #999;*/
  -webkit-border-radius: 5px;
  background-color: #122538;

  }
  ::-webkit-scrollbar-thumb:horizontal
  {
  width: 5px;
  background-color: #00C57C;
  -webkit-border-radius: 5px;

  }
</style>

Так получилось, что изначально на одном ресурсе ставился адаптированный шаблон, и вот его какой год нет на площадке, а мини чат сохранил этот мини чат, хотя был убран, но не удален, что сохранился рабочие состояние.

12 Февраля 2021 Просмотров: 1597 Комментариев: (0)

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

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

Kosten

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