1

次のコードを使用して、各画像の周りにリンクを設定して、fancybox で起動する flexslider カルーセルをセットアップしています。

<div class="flexslider">
   <ul class="slides">
      <?php foreach( $images as $image ): ?>
         <li>
            <a class="fancybox" href="<?php echo $image['sizes']['large']; ?>" rel="gallery">
               <img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" />
            </a>
         </li>
      <?php endforeach; ?>
   </ul>
</div>

<script type="text/javascript">
   $(window).load(function() {
      $('.flexslider').flexslider({
         animation: "slide",
         animationLoop: true,
         itemWidth: 135,
         itemMargin: 0,
         minItems: 5,
         maxItems: 5,
         directionNav: true,
         controlNav: false,
         slideshow: false
      });
   });
   $("a.fancybox").fancybox({
      helpers : {
         overlay : {
            locked : false
         }
      }
   });
</script>

ライトボックスは正しく読み込まれ、カルーセルは正常に機能しますが、Firefox でライトボックスを閉じると、すべてのリスト項目 (または画像) が再度クリックされるまで非表示になります。私が知る限り、Chromeでは問題なく動作します。何かご意見は？

4

1 に答える 1

1

以下を追加して修正しました。

.flexslider .slides li {
    backface-visibility:hidden;
}
于 2013-10-23T14:49:14.870 に答える