Дизайн принадлежит администрации сайта VSEpodrad.ru.
Администрация не несет ответственности за содержимое на нашем портале.
Администратор: .
|
Меню сайта
Смотри и качай бесплатно
Опрос сайта
Реклама
Онлайн пользователи
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Раздел в разработке
VSEpodrad.ru
В разработке!
На сайт добавлено файлов
Увеличенного изображения при наведении на миниатюру
Интересный плагин, который позволит вам подробнее рассмотреть детали изображения при наведении на его миниатюру курсора мышки
Сами картинки обрамляются следующим образом:
1) Для эффекта №1
2)Для эффекта №2
3) Для эффекта №3
Установка:
После /head на нужных страницах вставляйте:
Code
<script type="text/javascript" src="/js/miniZoomPan.js"></script>
<link rel="stylesheet" href="/css/miniZoomPan.css" type="text/css" media="screen" />
<script type= "text/javascript">/*<![CDATA[*/
$(function() {
$("#zoom01, #zoom02, #zoom03").miniZoomPan({
sW: 200,
sH: 250,
lW: 370,
lH: 462
})
$("#bacteria").miniZoomPan({
sW: 125,
sH: 125,
lW: 500,
lH: 500,
frameColor: "#000",
frameWidth: 60,
loaderContent: "<img src='/images/spinner.gif' />"
})
$("#pano").miniZoomPan({
sW: 515,
sH: 100,
lW: 3555,
lH: 690
})
});
/*]]>*/</script>
<link rel="stylesheet" href="/css/miniZoomPan.css" type="text/css" media="screen" />
<script type= "text/javascript">/*<![CDATA[*/
$(function() {
$("#zoom01, #zoom02, #zoom03").miniZoomPan({
sW: 200,
sH: 250,
lW: 370,
lH: 462
})
$("#bacteria").miniZoomPan({
sW: 125,
sH: 125,
lW: 500,
lH: 500,
frameColor: "#000",
frameWidth: 60,
loaderContent: "<img src='/images/spinner.gif' />"
})
$("#pano").miniZoomPan({
sW: 515,
sH: 100,
lW: 3555,
lH: 690
})
});
/*]]>*/</script>
Сами картинки обрамляются следующим образом:
1) Для эффекта №1
Code
<div id="zoom01">
<img src="Ссылка на картинку" />
</div>
<div id="zoom02">
<img src="Ссылка на картинку" />
</div>
<div id="zoom03">
<img src="Ссылка на картинку" />
</div>
<img src="Ссылка на картинку" />
</div>
<div id="zoom02">
<img src="Ссылка на картинку" />
</div>
<div id="zoom03">
<img src="Ссылка на картинку" />
</div>
2)Для эффекта №2
Code
<div id="bacteria">
<img src="Ссылка на картинку" />
</div>
<img src="Ссылка на картинку" />
</div>
3) Для эффекта №3
Code
<div id="pano">
<img src="Ссылка на картинку" />
</div>
<img src="Ссылка на картинку" />
</div>
Осталось лишь залить скрипт из прикреплённого архива в папку js стиль в папку css и картинку в папку images
Вы сейчас просматриваете Увеличенного изображения при наведении на миниатюру. Данный файл находится в категории Скрипты для ucoz. Чтобы увидеть другие файлы из этой категории, перейдите по этой ссылке: Скрипты для ucoz. Для того чтобы скачать Увеличенного изображения при наведении на миниатюру нажмите на кнопку СКАЧАТЬ ФАЙЛ выше. Надеемся вам понравился файл Увеличенного изображения при наведении на миниатюру и пригодился. По всем вопросам обращайтесь в чат на сайте или к администрации.
| Всего комментариев: 0 | |
