Как добавить подписи к фото в всплывающем окне?

голоса: 0

Здравствуйте! Скажите пожалуйста, как сделать при помощи fancybox подписи к увеличенным по клику фотографиям? Что надо добавить в HTML и CSS, чтобы получалась такая подпись, как, например, в фотогалереи при клике на фото:

Адрес сайта http://166deutsch.ucoz.net
| Автор: | Категория: Дизайн сайта
Изменение категории | | Автор: webanet

Ответов: 1

голоса: 0
 
Лучший ответ

Делается очень просто, добавляем фото с помощью кода вида:

<a href="ссылка на фото" data-url="ссылка на фото" onclick="$('.ph-link').fancybox({title: 'Здесь ваш текст который будет под фото' });" class="ph-link"><img src="ссылка на фото"></a>

| Автор:
Выбор ответа лучшим | | Автор: Марина Мушкина
Спасибо! Подпись функционирует отлично, но теперь не работает слайд-шоу, то есть переход от фотки к фотки при помощи стрелочек. Есть какой-то выход???
Марина Мушкина,

Ради интереса, удалите код фото который вы добавили и посмотрите, виновен ли этот код или вы еще чего натворили. И да, вы в шапку сайт добавили код:

<script src="jquery-1.9.0.min.js"></script>
 <link rel="stylesheet" href="fancybox/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/jquery.fancybox.pack.js?v=2.1.5"></script>
<link href="jquery.bxslider.css" rel="stylesheet">

там все ссылки некорректные и скрипты и стили не подгружаются, исправляйте ссылки на файлы стилей и скриптов и тогда слайдер будет работать корректно.

Дополнительно, в блок хеад вы добавили скрипт (лучше его удалить):

<script src="http://166deutsch.ucoz.net/js/jquery-3.3.1.min.js"></script>

он может конфликтовать с системным скриптом:

<script type="text/javascript" src="/.s/src/jquery-1.7.2.js"></script>

и в итоге создавать проблемы в работе как слайдера так и другого функционала.

...