0

我在我的投资组合网站上工作，我曾经Fancybox 2展示过一些投资组合项目。在 Firefox、Safari 和 Chrome 的桌面上一切都很好，但由于某种原因在移动设备 (iPhone) 上，下一个和上一个按钮不起作用，图像变小并略微向右跳。关闭按钮工作得很好。

这是我的 JavaScript：

<script type="text/javascript">
    $(document).ready(function() {
    $("a.fancybox").fancybox({
        'transitionIn': 'fade',
         'transitionOut': 'fade',
         'speedIn': 600,
         'speedOut': 200,
         'overlayShow': true,
         margin: [60, 60, 50, 60] // top, right, bottom, left
    });
});</script>

我没有更改下载css附带的任何默认设置fancybox，但我确实自定义了关闭和nav按钮。我不认为这与它有任何关系，不是吗？

如果有人可能知道如何解决此问题，我将非常感谢您的帮助！

谢谢！

4

1 回答 1

1

问题是因为触摸设备不支持:hover状态所以我认为你有 3 个选项：

1）。使箭头永久可见，如https://stackoverflow.com/a/8672001/1055987

.fancybox-nav span {
 visibility: visible;
}

2）。使用 jQuery-UI 的可拖动实现滑动方法，就像在这个http://jsfiddle.net/VacTX/4/中一样（不幸的是，有一个问题被版主删除，耻辱）......我真的很喜欢这个方法，它是一个虽然有点复杂。

3）。使用这个https://stackoverflow.com/a/8236090/1055987中的 fancybox 按钮助手

helpers: {
    buttons: {}
}
于 2013-09-10T17:40:29.127 回答