0

我在这里使用 jQuery 工具的标签手风琴：http ://www.jquerytools.org/demos/tabs/accordion.htm

整个事情被激活

代码：

$("#accordion").tabs(
  "#accordion div.pane",
  {tabs: 'h2', effect: 'slide', initialIndex: null}
);

虽然通过幻灯片功能显示窗格的内容，但在我的设置中，我希望仅在幻灯片动画完成后才显示窗格中的图像，并且应尽快隐藏当前选项卡的图像单击手风琴标题。我摆弄了一下，但无法让它工作。

我想将图像设置为显示：无；然后在显示其余内容后将它们更改为显示？

我可以通过在上面的代码中添加一些东西来做到这一点吗？非常感谢

4

4 回答 4

2

我想你会想做一个自定义动画。这应该很简单。

  $.tools.tabs.addEffect("custom", function(tabIndex, done) {

  // hide any images
  $("#accordion img").hide();

  // hide all panes and show the one that is clicked, on complete show images
  this.getPanes().hide().eq(tabIndex).show('fast',function(){
      //show the images again now that the animation has finished
      $("#accordion img").show();
  });

  // the supplied callback must be called after the effect has finished its job
  done.call();
  });

然后您可以将动画效果“幻灯片”替换为“自定义”。

于 2012-06-20T20:35:34.127 回答
0

我想将图像设置为显示：无；然后在显示其余内容后将它们更改为显示？

我就是这样做的。在所有图像上显示：无，然后：

$(document).ready(function () {
    $("#accordian img").show();
});

在加载整个文档之前，不会显示图像。

于 2012-06-20T20:27:41.243 回答
0

如果您的意思是要打开手风琴的窗格然后显示其中的图像，请查看手风琴的change事件，当窗格打开时，此事件可能会通知您。是的，您需要先将图像设置为隐藏。

于 2012-06-20T20:30:45.530 回答
0

您可以直接绑定到选项卡的“加载”事件...

$("#accordion").tabs(
  "#accordion div.pane",
  {tabs: 'h2', effect: 'slide', initialIndex: null,
    load: function(event, ui){
      $('accordian img').show();
    }
  }
);

Now when the tab loads complete (DOM is ready), it will show the images in the div, and ONLY AFTER the DOM has been updated to completely reflect the changes to the elements in the tab.

于 2012-06-20T20:35:19.647 回答