首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何在fotorama中重置activeIndex?

如何在fotorama中重置activeIndex?
EN

Stack Overflow用户
提问于 2014-08-12 19:15:11
回答 1查看 1.5K关注 0票数 0
代码语言:javascript
复制
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<link  href="http://fotorama.s3.amazonaws.com/4.6.0/fotorama.css" rel="stylesheet">
<script src="http://fotorama.s3.amazonaws.com/4.6.0/fotorama.js"></script>

<div class="fotorama">
  <img src="http://s.fotorama.io/1.jpg">
  <img src="http://s.fotorama.io/2.jpg">
</div>

有了上面的内容,如果我想用一组新的图像替换图像轮播,例如3和4,我会销毁fotorama,替换图像,然后再次打开fotorama。

代码语言:javascript
复制
var $fotoramaDiv = $('.fotorama').fotorama();

// 2. Get the API object.
var fotorama = $fotoramaDiv.data('fotorama');

fotorama.destroy();

$('.fotorama').html('<img src="http://s.fotorama.io/3.jpg"><img src="http://s.fotorama.io/4.jpg">');

// 3. Turn it on again.
$('.fotorama').fotorama();

这似乎工作得很好,因为fotorama记住了我正在浏览的图像的索引位置。例如,在原始图像轮播中,我从第一个图像转到第二个图像,这意味着activeIndex现在是1,然后我销毁fotorama,并创建一个新的图像3和4,如代码所示,当旋转木马激活时,索引从1而不是0开始,我正在查看图像4。我知道这些信息存储在activeIndex中,但即使我在销毁原始fotorama之前将其设置为0,新的fotorama也不会从0开始。

EN

回答 1

Stack Overflow用户

发布于 2014-09-01 06:08:10

使用API功能加载新图像并返回到第一个图像可能会更好:

代码语言:javascript
复制
// Load new images
fotorama.load([
  {img: '1.jpg', thumb: '1-thumb.jpg'},
  {img: '2.jpg', thumb: '2-thumb.jpg'}
]);

// Go to the first image
fotorama.show(0);

有关API和选项的更多信息可在此处找到:http://fotorama.io/customize/api/

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/25262873

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档