Flexslider轮播/ Fancybox图像消失(Flexslider carousel / Fancybox images disappearing)

编程入门 行业动态 更新时间:2024-10-18 20:26:00
Flexslider轮播/ Fancybox图像消失(Flexslider carousel / Fancybox images disappearing)

我有一个flexslider轮播设置,每个图像周围都有一个链接,可以在fancybox中使用以下代码启动:

<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中运行良好。 有什么想法吗?

I have a flexslider carousel setup with a link around each image to launch in fancybox with the following code:

<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>

The lightbox loads correctly and carousel functions fine, but when closing the lightbox in Firefox, all of the list items (or images) get hidden until clicked on again. It works fine in Chrome from what I can tell. Any thoughts?

最满意答案

通过添加以下内容修复:

.flexslider .slides li { backface-visibility:hidden; }

Fixed by adding the following:

.flexslider .slides li { backface-visibility:hidden; }

更多推荐

本文发布于:2023-08-02 09:56:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1372340.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:图像   Fancybox   Flexslider   disappearing   images

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!