Главная » 2011 » Октябрь » 20 » Неон спойлер в рамке с плавным переходом в другое освещение (Скрипты для ucoz)
20.10.2011, 16:11

Неон спойлер в рамке с плавным переходом в другое освещение





ДЕМО МАТЕРИАЛА
Устновка:

Вот CSS часть - отвечает за неон:
Code
/* стат неон leonP4 All-For-Kompa.RU */  
  a.nhp:hover {  
  text-decoration: none;  
  text-shadow: black 1px 1px 2px, red 0 0 1em;  
  }  
  a.nhp {  
  text-decoration: none;  
  text-shadow: black 1px 1px 2px, green 0 0 1em;  
  }  
  /* стат неон leonP4 All-For-Kompa.RU */

Эта часть отвечает за сам вид текста
Code
/* стат текст leonP4 All-For-Kompa.RU */  
  h3#nasposetili {  
  font: normal 15.4px tahoma;  
  position: relative;  
  color: #00B2FF;  
  padding: 10px 0px;  

  }  
  h3#nasposetili span {  
  position: absolute;  
  top: 22px;  
  left: 0;  
  width: 100%;  
  height: 9px;  
  background: #FFF; /* цвет накладываемого блока, должен совпадать с цветом фона основного блока */  
  overflow: hidden;  
  opacity: 0.45;  
  filter: alpha(opacity=45);  
  }  
  /* стат текст leonP4 All-For-Kompa.RU */

Идём дальше...

Теперь после того как подключили CSS будем работать с кодовой частью:
Code
<div class="infmes">  
  <a class="nhp" onclick="$('#ktoposetil').slideToggle('slow');" href="javascript://"><h3 id="nasposetili"><b>Нас сегодня посетили</b><span></span></h3> </a>  
  <div style="display: none;" id="ktoposetil">  
  здесь любая информация  
  </div></div>

Ой, чуть не забыл, нужно ещё CSS код рамки прописать:

Возвращаемся обратно в CSS и дописываем это:
Code
.infmes {border:1px dashed #b2b2b2;margin:5px 0 3px 0;padding:5px;background:#fff;font-size:7pt; color:#828282;}

Теперь всё готово! Наслаждаемся красивым видом!
Материал взят с сайта infoscript.ru
Внимание! Копирование данного материала запрещено без указания ссылки на сайт Infoscript.ru
Источник/Автор: siteforsites.ru
Категория: Скрипты uCoz | Просмотров: 1767 | Добавил: manikom-auto | Рейтинг: 3.0/1 |
Теги: неон, Освещение, плавным, другое, переходом, рамке, Спойлер
Пока комментариев нет. Ты можешь быть первым!
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]