使用fancybox +全屏选项

Question

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

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

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

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

Answer 1

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

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

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