16:50
ОбновитьСмайлыУправление мини-чатом
Вы вошли как Гость | Группа "Гости" | RSS

[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Форум » Скрипты для сайта Ucoz » Скрипты Ucoz » Красивое увеличение картинки при наведении курсора на jQuery (Красивое увеличение картинки с эффектом вращения)
Красивое увеличение картинки при наведении курсора на jQuery
AmazonkaДата: Пятница, 18.02.2011, 20:45 | Сообщение # 1
Майор
Группа: Администраторы
Сообщений: 37
[ ]
Offline

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

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

Установка:

После /head на нужных страницах вставляйте:

Code

<script src="/js/init.js" type="text/javascript"></script>    
<script src="/js/raphael.js" type="text/javascript"></script>    
<style>ul.reset,    
ul.reset li {    
display:block;    
list-style:none;    
padding:0;    
margin:0;    
}    
.gallery ul li {    
width:200px; /* a half of image width */    
height:200px; /* a half of image height */    
margin:0 10px 10px 0;    
float:left;    
position:relative;    
}    
.holder {    
position:absolute;    
top:0;    
left:0;    
margin:-100px 0 0 -100px; /* margin-left: a half of 'li' width and margin-top: a half of 'li' height */    
}    
</style>

Следующий код в то место, где будет сама картинка:

Code

<div class="gallery">    
<ul class="reset">    
<li><img src="Ссылка на картинку" border="0" /></li>    
</ul>    
</div>

При желании и знании css вы легко сможете отредактировать все параметры скрипта под себя

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

Источник материала: http://u1.do.am

Ссылка на источник материала.

Форум » Скрипты для сайта Ucoz » Скрипты Ucoz » Красивое увеличение картинки при наведении курсора на jQuery (Красивое увеличение картинки с эффектом вращения)
  • Страница 1 из 1
  • 1
Поиск:

Сделать бесплатный сайт с uCoz

www.owi.3dn.ru © Все права защищены! 2010-2011 Сайт оптимизирован под разрешение экрана 1280х1024 и браузеры Mozila Firefox
Загрузка...