我正在从标准HTML链接启动fotorama jquery gallery插件。它工作得很好，但我想立即以全屏模式启动，而不是必须点击fotorama中的链接才能在启动后将其更改为全屏。
我的代码是：
<div id="fotorama" class="fotorama"
data-width="100%"
data-height="100%"
data-nav="thumbs"
data-allowfullscreen="true"
data-transition="crossfade"
data-auto="false">
</div>
<p class="something">Something</p>
<script>
$(function(){
$('.something').click(function(){
var $gallery = $('#fotorama').fotorama();
var fotorama = $gallery.data('fotorama');
// Overwirte all the photos
fotorama.load([
{img: '0027.jpg'},
{img: '1759.jpg'}
]);
});
});
</script>
由于我找不到API文档（也许它还没有完整？）我想知道是否有人知道如何做到这一点？
非常感谢。
答案 0 :(得分：3)
requestFullScreen() 使用Fotorama API调用并阻止自动初始化：
<script>
$(function () {
var fotorama = $('.fotorama')
.fotorama({allowfullscreen: true})
.data('fotorama');
fotorama.requestFullScreen();
});
</script>
<div class="fotorama"
data-auto="false"
data-height="100%">
<img src="1.jpg">
<img src="2.jpg">
</div>
但右上角会有一个全屏退出图标，用户可以全屏离开。即使您使图标不可见，也可以通过按esc按钮关闭全屏。所以......
data-width="100%" data-height="100%" 我认为最好使用此片段模仿全屏：
<body style="margin: 0;">
<div class="fotorama"
data-width="100%"
data-height="100%">
<img src="1.jpg">
<img src="2.jpg">
<img src="3.jpg">
</div>
</body>
答案 1 :(得分：1)
我浪费了很多时间试图隐藏Fotorama块。 尝试添加“fotorama - hidden”类。
<div class="fotorama fotorama--hidden">
<!-- images -->
</div>
这将隐藏块，但Art's answer #1中的所有功能都将正常工作。 当你退出全屏时，Fotorama只会隐藏。