• Страница 1 из 1
  • 1
Форум Сталкер » Архивная библиотека » Старые скрипты uCoz » Красивое увеличение картинки с эффектом вращения
Красивое увеличение картинки с эффектом вращения
XemorDioДата: Понедельник, 04.04.2016, 07:17 | Сообщение # 1
Генерал-полковник
Группа: Пользователи
Сообщений: 897
Награды: 7
Репутация: 8
Статус: 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 вы легко сможете отредактировать все параметры скрипта под себя

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

 
Форум Сталкер » Архивная библиотека » Старые скрипты uCoz » Красивое увеличение картинки с эффектом вращения
  • Страница 1 из 1
  • 1
Поиск:
Поделись с другими сталкерами
Меню сайта
Гость
Статистика
Интеллектуальный каталог ресурсов интернет