使用fancybox +全屏选项

在我的网站上 ，我有一些图像，我在fancybox中显示它们。 一切正常，但现在网站的要求是为照片设置全屏模式，全屏我的意思是我想在我的fancybox底部添加一个按钮，当用户点击该按钮时，当前图像（fancybox图像）必须以全屏模式显示。

全屏示例： http ： //buildinternet.com/project/supersized/slideshow/3.2/demo.html

但是这个例子不适合我的情况，因为我仍然需要在全屏模式之前使用fancybox。

所以有人有一些代码要分享或者一些好的库，我可以做那个集成btw jQuery Fancybox和一些全屏api？ 谢谢

Answer 1

以下步骤将满足您的需求：

1. 请参阅以下URL以了解如何向Fancybox 添加自定义按钮：向jQuery的fancybox添加自定义按钮 。 这需要一些努力但它确实有效。
2. 首次显示Fancybox时，请勾选自定义按钮以启动全屏模式。 使用Supersized插件 。
3. 用于显示超级图像的div将隐藏在页面上，并且在启动全屏时您将显示Supersize div。
4. 向Supersized div添加“关闭”按钮，并在单击时隐藏div

以上步骤将会这样做。 Fancybox和Supersized都需要一些自定义，但您将能够达到预期的效果。