Использование опции fancybox + fullscreen - PullRequest
Новая
       6

Использование опции fancybox + fullscreen

4 голосов
/ 06 июля 2011

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

Пример полноэкранного режима: http://buildinternet.com/project/supersized/slideshow/3.2/demo.html

Но этот пример не подходит для моей ситуации, потому что мне все еще нужен fancybox перед полноэкранным режимомmode.

Значит, у кого-то есть какой-нибудь код для обмена или какая-то хорошая библиотека, которую я могу сделать, например, интеграция с JQuery Fancybox и какой-нибудь полноэкранный API?спасибо

1 Ответ

5 голосов
/ 08 июля 2011

Следующие шаги сделают то, что вы ищете:

  1. См. Следующий URL, чтобы узнать, как добавить пользовательскую кнопку в Fancybox: Добавление пользовательских кнопок в fancybox jQuery .Это займет немного усилий, но это работает.
  2. При первом отображении Fancybox, нажмите пользовательскую кнопку, чтобы запустить полноэкранный режим.Используйте плагин Supersized .
  3. Элемент div, используемый для отображения изображений Superersize, будет скрыт на странице, и при запуске в полноэкранном режиме вы увидите div Supersize.
  4. Добавьте кнопку «Закрыть» в суперразмерный элемент div и скройте элемент div при нажатии

Выполненные выше действия сделают это.Для Fancybox и Supersized требуется немного настроек, но вы сможете достичь желаемого эффекта.

...