На главную Форум сайта Вы Гость + Регистрация / Вход
Информер с эффектами при наведении - Форум чат общение
ПОПУЛЯРНЫЕ ТЕМЫ
[Игра] 15 +
Оставлено 179 сообщений в теме
досчитай до 100
Оставлено 99 сообщений в теме
Как разыграть друга в в...
Оставлено 72 сообщений в теме
Сигны в формате psd
Оставлено 70 сообщений в теме
[Игра] Города
Оставлено 69 сообщений в теме
[Игра] Поставить + выше...
Оставлено 44 сообщений в теме
Раздача WMB
Оставлено 41 сообщений в теме
 

  • Страница 1 из 1
  • 1
Информер с эффектами при наведении
Support@NC
Дата: Воскресенье, 20.11.2011, 00:18 | Сообщение # 1
Создатель топика
NN-CS.3DN.Ru Агент
Администратор
Сообщений: 0
Репутация: 54
Награды: 8
[RU]


Создаем информер :

[ Каталог файлов · Материалы · В случайном порядке · Материалы: 3 · Колонки: 4 · Длина заголовка: 25 ]
и пихаем туда
Code

<style>  
  .nazv {color:#1C86EE;font-size: 16px;text-align: center;padding:0 0 10 0;text-shadow:1px 1px 1px #333;}  
  .opis {color:#dedede;font-size: 13px;text-align: left;}  
  .entry {color:#00ff3w;font-size: 15px;text-align: right;padding:10 15 0 0;}  
  </style>  
  <script type="text/javascript">     
         
  $(document).ready(function () {  
         
     var colour = $("#overlay$ID$");  
     var content = $("#hover$ID$");  
         
     content.hide();  
     colour.hide();     
         
     $("#container$ID$").hover(function() {  
     content.stop().show().css({ "left" : "-450px" }).animate({left : 0}, 290);  
     colour.stop().fadeTo(500, .7)  
     }  
     ,function() {  
     content.stop().animate({left : 450}, 290);  
     colour.stop().fadeTo(500, 0)  
     });  
  });  
         
  </script>     
  <style>  
  #container$ID$ {height:155px;width:300px;-moz-background-size:100% 100%;-webkit-background-size:100% 100%;-o-background-size:100% 100%;-khtml-background-size:100% 100%;background-size:100% 100%;position:relative;overflow:hidden;z-index:0;padding:0;margin:0 auto;background-image:url($AUTHOR_EMAIL$);border:1px solid #414141;}  
  #container$ID$:hover {border-color:#303030;}  
  #overlay$ID$ {background-color:#000;display:block;position:absolute;top:0;left:0;width:300px;height:155px;}  
  #hover$ID$ {color:#fff;width:300px;display:block;height:155px;position:absolute;padding:10px;}  
  </style>     
  <div id="container$ID$"><div id="overlay$ID$"></div><div id="hover$ID$">     
  <div class="nazv"><a href=""><b><font color="#00BFFF">$TITLE$</font></b></a></div>  
  <div class="opis">  
  <b>Раздел :</b> <a href="/load/">Каталог файлов</a><br>  
  <b>Категория :</b> <a href="$CATEGORY_URL$">$CATEGORY_NAME$</a><br>  
  <b>Дата :</b> $DATE$<br>  
  <b>Скачали :</b> $LOADS$ раз<br>  
  <b>Комментариев :</b> $COMMENTS_NUM$  
  </div>  
  <div class="entry"><b><a href="$ENTRY_URL$">Перейти к материалу</b></a></div>  
  </div></div>


А ето в head страницу где будет стоять информер

Code
<script type="text/javascript" src="http://sc-ucoz.at.ua/js/jquery.min.js"></script>


Служба поддержки NN-CS.3DN.Ru Агент
  • Страница 1 из 1
  • 1
Поиск:

Как писать сообщения и создавать свои темы на форуме?

Вверх