如何启用 fotorama 滑块的双击事件以全屏显示,就像我们在右上角看到的一样
2021 次
1 回答
1
您可以使用此 jquery 事件http://api.jquery.com/dblclick/来执行此功能
fotorama.requestFullScreen()
请记住,您应该在 api 的标题中手动初始化 fotorama,您可以看到它是如何做到的。
这是一个给你的例子!
http://jsfiddle.net/meickol/8dv7k/ 你怎么看很容易!祝你好运!
HTML
<base href="http://fotorama.s3.amazonaws.com/i/okonechnikov/">
<!-- Fotorama -->
<div class="fotorama_custom" data-width="700" data-ratio="700/467" data-max-width="100%">
<img src="1-lo.jpg">
<img src="2-lo.jpg">
<img src="9-lo.jpg">
<img src="6-lo.jpg">
<img src="5-lo.jpg">
</div>
脚本
<script>
// 1. Initialize fotorama manually.
var $fotoramaDiv = jQuery('.fotorama_custom').fotorama({
click:false,
allowfullscreen:true,
});
// 2. Get the API object.
var fotorama = $fotoramaDiv.data('fotorama');
jQuery('.fotorama').dblclick(function(){
fotorama.requestFullScreen();
});
</script>
于 2014-03-21T07:11:22.753 回答