Главная » Файлы » Прочие скрипты » jQuery

Замечательные эффекты при наведении на ссылки через плагин jQuery Effects (Адаптация by Apocalypse)
23.06.14, 09:37:51

Скачать файл




Замечательный плагин, который придаст вашему сайту оригинальность и позволит вашим пользователям насладиться замечательными качественными эффектами при наведении курсора на ссылки

Для начала посмотрите ДЕМО

Установка:

После /head на нужных страницах вставляйте:
Код
<script type="text/javascript" src="/js/jquery.jeffects.js"></script>

<script>
$( function() {  
$("a[href]").jEffects({  
type:'bomb',  
randomizeParticles: true,  
colors: [ "#f88", "#8e4", "#4bf"],  
particles: 16,  
radius:64  

});  
});  
</script>
<style>  
.effects { clear:both }
.effects li { display:inline-block; *display:inline; font-size:24px; padding:4px 10px; cursor:pointer }  
.effects li:first-child { background:#222; float:left; opacity:0.6; height:auto; width:180px; text-align:left; }  
.effects li:hover { color:#fff; }  

i { font-size:0.5em }  

.jEffects-particle { font-size:20px; font-family:arial; z-index:2; position:absolute }  

.distance { height:80px;}  
.distance li.first { *margin-right:160px; }  
.distance li { *float:left; height:40px; vertical-align:top; border-top:1px solid #666; }  

.distance li img { opacity:0.6 }  
.distance li:hover img { opacity:1.0 }  

.concentrate li { opacity:0.6; }  
.concentrate li:hover { opacity:1.0; }  

#overview { margin:auto; width:370px; text-align:left; color:#fff }  
#overview pre { background:#246; padding:4px; }  

.themes { position:fixed; left:0; top:0; z-index:10; width:100% }  
a.theme { float:left; background:#eee; color:#222; top:0; display:block; padding:6px; font-size:24px; height:46px; line-height:46px; }  
a.buy { background: #202020; color:#FFFFFF; }  
a.white { left: 0; }  

.jeffects_min { display:none }  

.jorbital { float:right; color:#fff }  
</style>


Всё, скрипт установлен и готов к работе. Разберёмся с настройками:

type:'bomb', - тип используемой анимации (fireball , bomb , snow , bubbles , concentrate)
randomizeParticles: true, - использовать ли беспорядочные направления анимации (true или false)
colors: [ "#f88", "#8e4", "#4bf"], - используемые цвета
particles: 16, - количество вылетающих элементов при наведении
radius:64 - максимальный радиус элемента

Осталось лишь залить скрипт из прикреплённого архива в папку js

Автор адаптации эффектов для наведения на ссылки для сайтов в системе uCoz (И не только) - Apocalypse

Материал подготовлен Apocalypse

Категория: jQuery | Добавил: Apocalypse | Теги: effects, ссылки, при, Через, плагин, на, JQuery, наведении, эффекты, замечательные
Просмотров: 235 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: