Главная » Файлы » Прочие скрипты » jQuery
Плавное изменение прозрачности элементов наjQuery для uCoz
22.06.14, 19:54:27

Скачать файл



Прозрачность можно придать абсолютно любому элементу на сайте благодаря этому замечательному плагину для jQuery

Для начала в head добавьте следующий скрипт:
Код
<?if($USER_AGENT$='ie')?><?else?>  
  <script src="http://apocalypse.ucoz.kz/js/opacity.js"></script>  
  <script type="text/javascript">  
  fadeOpacity.addRule('oR1', .5, 1, 50);  
  </script><?endif?>


Этот скрипт и будет отвечать за вное появление и угасание элементов...

Пример картинки с плавным изменением прозрачности:
Код
<img style="opacity: 0.5;" id="fImg1" onMouseOver="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)" src="http://apocalypse.ucoz.kz/images/home.png" title="Перейти на главную" border="0">


Подробнее:

style="opacity: 0.5 - первоначальная прозрачность элемента

id="fImg1" - уникальный ID (Для каждого элемента свой ID (Менять лишь значение, выделенное красным цветом)

onMouseOver="fadeOpacity(this.id, 'oR1')" - отвечает за плавное появление при наведении
onmouseout="fadeOpacity.back(this.id)" - отвечает за плавное угасание при отведении курсора

Пара примеров с элементами сайта:

Таблица:
Код
<table style="opacity: 0.5;" id="fImgtable1" onMouseOver="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)" border="0">  
  <tr><td>Код в таблице</td></tr></table>


Простой текст:
Код
<div style="opacity: 0.5;" id="fImgtext1" onMouseOver="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)">Простой текст</div>


Вот и всё! В дизайне на данном сайте используется именно этот скрипт smile
Категория: jQuery | Добавил: Apocalypse | Теги: прозрачности, Плавное, изменение, ucoz, элементов, наjQuery, для
Просмотров: 593 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: