Перейти к содержимому


Увеличение Картинки


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 3

#1 sprtanec

sprtanec

    Новичок

  • Пользователи
  • Pip
  • 7 сообщений

Отправлено 24 Май 2015 - 15:10

Добрый день. Подскажите пожалуйста. Хочу создать страницу со сканами сертификатов и договоров. Для этого хочу. Что бы при нажатии на них картинка увеличивалась в этом же окне. А при нажатии на уже увеличившуюся картинку, она уменьшалась. Пример: отзывы вот здесь: http://afraspb.ru/

#2 Firefly

Firefly

    Активный участник

  • Модераторы
  • 3 750 сообщений

Отправлено 24 Май 2015 - 15:53

Просмотр сообщенияsprtanec (24 Май 2015 - 15:10) писал:

Добрый день. Подскажите пожалуйста. Хочу создать страницу со сканами сертификатов и договоров. Для этого хочу. Что бы при нажатии на них картинка увеличивалась в этом же окне. А при нажатии на уже увеличившуюся картинку, она уменьшалась. Пример: отзывы вот здесь: http://afraspb.ru/

Здравствуйте.
Вам необходимо будет создать уменьшенные копии оригинальных изображений с разрешением примерно 300x400.

После создания новой страницы зайдите в редактирование этой страницы и нажмите на панели инструментов кнопку "Источник"(скриншот в приложении)
Далее вставьте в окно код:
<a href="ссылка на оригинальное изображение 1" onclick="$(this).nyroModalManual();return(false);" rel="gallery" target="_blank"><img alt="" src="ссылка на маленькое изображение 1" />&nbsp; &nbsp; </a>
<a href="ссылка на оригинальное изображение 2" onclick="$(this).nyroModalManual();return(false);" rel="gallery" target="_blank"><img alt="" src="ссылка на маленькое изображение 2" />&nbsp;&nbsp; </a>
<a href="ссылка на оригинальное изображение 3" onclick="$(this).nyroModalManual();return(false);" rel="gallery" target="_blank"><img alt="" src="ссылка на маленькое изображение 3" /> </a>
Не забудьте вставить ссылки на свои изображения.

Далее зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Скрипты -> main.js и вставьте в конце код:
$(function() {
$('.htmlDataBlock a[rel="gallery"]').removeAttr('onclick').click(function() {
$(this).fancybox();
return (false);
});
});

Прикрепленные изображения

  • Screenshot_1.png


#3 miniplaneta

miniplaneta

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 140 сообщений

Отправлено 09 Август 2016 - 18:06

Здравствуйте.

У меня в Карамели такое не пошло (((
Я делал в шаблоне HTML (с 279строки)  взамен:

<div class="banner">
<a href="https://st.storeland...24/133/PGU.jpg" target="_blank"><img src="https://st.storeland...24/133/PGU.jpg" alt="banner1" title=" " style="width: 280px;" /></a>
<a href="https://st.storeland...terinburga.jpg" target="_blank"><img src="https://st.storeland...terinburga.jpg" alt="banner2" title=" " style="width: 280px;" /></a>
<a href="https://st.storeland..._ekonomiki.jpg" target="_blank"><img src="https://st.storeland..._ekonomiki.jpg" alt="banner3" title=" " style="width: 280px;" /></a>
</div>

Помогите научится пожалуйста, а то у меня таких картинок с привязкой к страничкам предполагается массово.
Лучше  через скрипт и с описанием класса в майне.

Сообщение отредактировал miniplaneta: 09 Август 2016 - 18:09


#4 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 10 Август 2016 - 02:22

Попробуйте воспользоваться следующей инструкцией, в ней идет использование галереи fancybox:
http://forum.storela...post__p__164502




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных