Sign in

Зарегистрируйтесь, чтобы стать полноправным участником сообщества Masterpro.ws.

Jquery Image Zoom Plugin

Варианты зума (увеличения) ваших картинок вполне способны эффектно украсить ваш сайт, придать ему оригинальность и стильно преподнести изображения.

 

 

Несколько различных демок вы можете увидеть на сайте проекта -  действительно красиво и на все вкусы. Jquery Image Zoom Plugin бесплатен.

Упростим задачку - для начинающих. Чтобы создать на своем сайте аналогичную презентацию - скачайте этот архив. Сразу после распаковки откройте файл demo.html плагина в любом браузере. Работает? Великолепно! Все, что вам нужно сделать теперь - это разместить на вашем сайте содержащийся в этом самом html-файле код:

 

 

<script src='jquery-1.8.3.min.js'></script>
<script src='jquery.elevateZoom-2.5.5.min.js'></script>
<img id="zoom_01" src='images/small/image1.png' data-zoom-image="images/large/image1.jpg"/>
<script>
$('#zoom_01').elevateZoom();
</script>

 

, заменить картинки на свои и проследить, чтобы пути к изображениям и скриптам (два файла с расширением js) - соответствовали действительным, реальным путям вашего сайта.

Успехов в работе! Помните - все и всегда очень несложно... было бы желание. :) 

P.S. Горделивые владельцы интернет-магазинов смогут без проблем прикрутить этот плагин к VirtueMart... подробный рассказ о том, как это сделать - на форуме. Welcome по ссылке.

P.P.S Кстати, вы еще не заказали у нас интернет-магазин либо web-сайт на том или ином свободном движке? Если так, сейчас самое удачное время. Для всех, кто закажет интернет-магазин на Masterpro.ws - предлагаем уникальную дисконтную программу! Свободный движок, использование которого вам не придется ежегодно оплачивать; эксклюзивные, разработанные специально для вас фичи, SEO для вашего интернет-магазина - все это Вам!

 

4 комментарии

  • Aleksej

    написал Aleksej

    Среда, 15 января 2014 08:52

    Здравствуйте. Нет, не думаю. Хак для VirtueMart был реализован в контексте работы над коммерческим проектом; поскольку эксклюзива либо несвободных расширений данная разработка не содержала - она вынесена на форум. K2 в тот момент не рассматривался.

  • worty

    написал worty

    Вторник, 14 января 2014 09:07

    Здравствуйте! Не подскажете как создать этот эффект
    в К2 в изображении материала - то которое в закладке "изображения"

  • Aleksej

    написал Aleksej

    Четверг, 02 мая 2013 12:42

    Спасибо, Сергей, это действительно эффектно и изящно сделано.

  • deeserge

    написал deeserge

    Четверг, 02 мая 2013 11:33

    Попробуйте еще этот бесплатный jQuery плагин увеличения изображения с эффектом лупы http://zoomsl.tw1.ru. Похож на Cloud Zoom v3.0. Работает во всех браузерах, даже в ие8 поддерживается плавность анимации, чего не скажешь про другие бесплатные плагины.

Оставить комментарий

Добавьте ваш комментарий

Комментарии в блоге

  • Aleksej Интересно отметить: за всю свою жизнь в российском IT у меня не было ни одного проекта - а в пору,…

    Вторник, 19 января 2021

    Опубликовано в: Про IT Selection, gray salary и Барака Обаму
  • Рамат Они до сих пор такую шляпу предлагают с оформлением в известную американскую компанию через ИП или самозанятого, на прошлой неделе…

    Пятница, 15 января 2021

    Опубликовано в: Про IT Selection, gray salary и Барака Обаму
  • serge Да вроде на месте ссылки, Вася. Чем не устраивает сайт разработчика и его github?

    Четверг, 17 декабря 2020

    Опубликовано в: Fakeloader.js
  • Вася А где ссылки на скрипты? или их нет? скачивать нечего?

    Четверг, 17 декабря 2020

    Опубликовано в: Fakeloader.js
  • Aleksej This is a very old project, Lukas. Support has ended.

    Воскресенье, 06 декабря 2020

    Опубликовано в: Category Product Combinations. Prestashop module