0

私は自分のポートフォリオWeb サイトに取り組んでおり、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)。このhttp://jsfiddle.net/VacTX/4/のようにjQuery-UIのドラッグ可能を使用してスワイプメソッドを実装します（残念ながらモデレーターによって削除された質問がありました、残念です）...私は本当にこのメソッドが好きです、それはもう少し複雑ですが。

3)。このhttps://stackoverflow.com/a/8236090/1055987のようなファンシーボックスボタンヘルパーを使用してください

helpers: {
    buttons: {}
}
于 2013-09-10T17:40:29.127 に答える