0

我正在使用fancybox js 和 css 来制作图像滑块。在那个滑块中，我想动态更改图像的数量和图像的 src，但我对此一无所知。

代码：

$("#fancybox-manual-c").click(function () {
    alert("clicked");
    $.fancybox.open([
        {
            href: 'http://fancyapps.com/fancybox/demo/1_b.jpg',
            title: 'this image links to bbc news'
        }, {
            href: 'http://fancyapps.com/fancybox/demo/2_b.jpg',
            title: 'this image links to jquery'
        }, {
            href: 'http://fancyapps.com/fancybox/demo/3_b.jpg',
            title: 'this image links to fancybox'
        }
    ], {
        nextEffect: 'fade',
        prevEffect: 'fade',
        loop: false,
        mouseWheel: true,
        openEffect: 'elastic',
        closeEffect: 'elastic',
        openOpacity: true,
        closeOpacity: true,
        cyclic: false
    });
    return false;
});
4

1 回答 1

0

你使用花哨的盒子 1.3 还是 2？

  1. 一般来说，首先最好了解动态的含义。您想在哪个事件中更改图像？即当用户点击某些东西或在特定的时间间隔内

  2. 您想从哪里获得新的图像集？通过 ajax 加载它们还是它们已经嵌入到页面中的某个地方？

我有时会这样做：

<a class="mylink" href="#firstset">link</a>
<a class="mylink" href="#secondset">link</a>  

    <div class="content" style="display:none">
      <div id="firstset">
        image...
      </div>
      <div id="secondset">
        image...
      </div>
    </div>

    <script>
    $(".mylink").click(function() {
    var $content = $($(this).attr('href')).clone();

    $.fancybox({
      'titlePosition': 'inside', 'padding': '0', 'titleShow': false,
      'content': $content,
      'onComplete': function () {
        init your slider

      }
    });
    return false;
})

这只是为了给你一个想法，许多可能的解决方案之一指定的比你能得到更好的答案更准确

于 2013-04-23T11:05:35.133 回答