Меню сайта
Категории сайта
Скрипты для uCoz [3754]
Бесплатные шаблоны uCoz [3804]
Иконки форума групп [221]
Графика для сайта [2033]
PSD Макеты [132]
Кисти для фотошопа [265]
Уроки фотошопа на русском языке [18]
Стили для фотошопа [60]
Шрифты для фотошопа cs4 [47]
Web-master [3046]
Обзоры и статьи [74]
Шаблоны DLE [79]
Уникальные файлы от isuCoz [5]
Counter - Strike [29]
Мини-чат
Наш опрос
Сколько Вы зарабатываете?
Результаты · Архив опросов
Всего ответов: 4912
Облако тегов
Патчи CS 1.6 ФОТО уроки фотошопа все для Ucoz Всё для Counter Strike 1.6 ТОП сайтов Информер Новости AllSubmitter как crocuz 2009 графика сборник Блок онлайн анимация Сайт Смайлы Portal Иконки групп софт Фильмы вконтакте music музыка Видео новый сайты свой шаблон Скачать PSD Видеоурок PHOTOSHOP uCoz юкоз красивый шаблон для uCoz шаблоны скрипты Игры Rip профиль Мини-профиль ajax урок Кнопка добавить новость заработок скрипт Vista шрифты Icon сборка cs шаблон шапки шапка для сайта by sasho groups кнопки аватар Текстуры Программа стили советы рамки Крокуз для сайтов Counter-Strike на тему Меню кисти вид оптимизация программы Windows Светлый Создать сайта раскрутка Кисти для фотошопа ICQ форум CSS forucoz.com web иконки Групп icons фотошоп бесплатно добавить Топ кино скрипты для Ucoz DLE портал
Статистика
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Нас посетили:
Мини-профиль
Поиск
Календарь
«  Июнь 2009  »
Пн Вт Ср Чт Пт Сб Вс
1234567
891011121314
15161718192021
22232425262728
2930
Статистика
Архив
Реклама
Узнай айпи
Главная » 2009 » Июнь » 6 » Скрипты для uCoz » Красивый плагин для увеличения Ваших фото
Красивый плагин для увеличения Ваших фото
Вы пришли к нам на портал что бы скачать\посмотреть Красивый плагин для увеличения Ваших фото, если возникнут вопросы по данному файлу Красивый плагин для увеличения Ваших фото, вы всегда можете задать свой вопрос на нашем форуме.
С уважением, администрация isucoz.com.

Скачать Красивый плагин для увеличения Ваших фото

Пример
Скачать архив

Для этого нам понадобится:

jQuery

В начале документа, между тегами <head></head> нам необходимо разместить следующий код:

Code
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.jqzoom.js"></script>
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function(){
$("img.jqzoom").jqueryzoom({
  xzoom: 200, //ширина окна просмотра зума (200 по умолчанию)
  yzoom: 200, //высота окна просмотра зума (200 по умолчанию)
  offset: 10 //отступ от картинки (10 по умолчанию)
  //position: "right" //позиция окна зума ("right" - по умолчанию)
  });
});
</script>

В нем мы подключаем фреймворк, потом подключаем функцию самого зума и в конце задаем основные настройки. Объяснение настроек доступно в комментариях кода.

CSS

Code
<link rel="stylesheet" href="style/jqzoom.css" type="text/css" media="screen" />

Присоединяем таблицу стилей (также между тегами <head></head>). Здесь можно дать волю фантазии и экспериментировать.

HTML

HTML код для оформления фото выглядит следующим образом:

Code
<span class="tozoom"><img src="images/shoe1_small.jpg" class="jqzoom" alt="images/shoe1_big.jpg"></span>
<span class="tozoom"><img src="images/shoe2_small.jpg" class="jqzoom" alt="images/shoe2_big.jpg"></span>
<span class="tozoom"><img src="images/shoe3_small.jpg" class="jqzoom" alt="images/shoe3_big.jpg"></span>

Как Вы видите, каждое фото мы заворачиваем в слой с классом "tozoom". Для каждого фото мы добавляем класс "jqzoom". И в атрибуте alt мы прописываем путь к увеличенному фото.

Кому понравилось ставим +!

У вас есть сайт, но ты незнаешь какой у тебя тИЦ и ПР? Будь в курсе событий, поставь счетчик тИЦ и ПР на свой сайт! Счетчик тИЦ и ПР.
Добавил: Simpsonnn | Комментариев: 4 | Просмотров: 2563 | Добавлено: 06-Июн-2009

0  
4 gorf   (09-Июн-2009 04:15:13) [Материал]
gorf+)
0  
3 Joker251   (07-Июн-2009 13:07:14) [Материал]
Прикольно!!!
0  
2 naruto-inform-site   (06-Июн-2009 21:50:33) [Материал]
ccccууууууупппппппппеееееееррррррр лови +
0  
1 B-look   (06-Июн-2009 14:07:14) [Материал]
Прикольно, мне понравилось держал+
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Дизайн изготовлен Yerbol'ом. © 2008-2015. Sitemap. Хостинг от uCoz.
На сайте isucoz.com собраны уникальные скрипты для ucoz, шаблоны для ucoz, иконки групп для ucoz.
...