1

ユーザーがAppleデバイスからWebサイトを表示しているかどうかを検出しようとしています。そうであれば、div「carriage-promo」を特定の方法で動作させます。

通常、この div にはトランジションがあり、ユーザーがページを下にスクロールすると高さが 0px から 40px になるようにアニメーション化されますが、これはタッチ デバイスではうまく機能しないため、静的にしたいと考えています。

検討：

    $(document).ready(function(){
        var isiPhone = navigator.userAgent.toLowerCase().indexOf("iphone");
        var isiPad = navigator.userAgent.toLowerCase().indexOf("ipad");
        var isiPod = navigator.userAgent.toLowerCase().indexOf("ipod");

        if(isiPhone > -1)
        {
            $('#carriage-promo').css({'position':'fixed','bottom':'40px','width':'100%'});
        }
        if(isiPad > -1)
        {
            $('#carriage-promo').css({'position':'fixed','bottom':'40px','width':'100%'});
        }
        if(isiPod > -1)
        {
            $('#carriage-promo').css({'position':'fixed','bottom':'40px','width':'100%'});
        }
    });

過去に条件付きスタイリングの動作に CSS3 メディア クエリしか使用したことがありませんでしたが、今回は jQuery/JS が必要です。

助言がありますか？小さな構文エラーか、これがどのように機能するかを完全に誤解していると思います!

4

1 に答える 1

1

次の行を準備完了に追加してみてください:

window.scrollBy(0, 1);

iOS > 5 で役立つように見え
ます 位置を使用する別の方法: 絶対位置と下位置の設定 scrollTop + windowHeight - promoHeight

于 2013-09-04T08:49:43.250 に答える