0

ブートストラップでワードプレスのテーマを作成しました。カルーセルと接辞を使用しています。

現在、カルーセルがスライドを変更すると、.affix はその期間にわたって機能しません。カルーセルが遷移を終了すると、position:fixed の div が再び正しく表示されます。

ここで確認できます: http://hu.rundertisch.org/?page_id=106

左側のナビゲーションは、一番下までスクロールすると position:fixed になります。背景画像の遷移が始まるまで待ってから、下にスクロールします。メニューが画面と一緒に移動していないことがわかります。移行が完了したら、もう一度試してみてください。違いがわかります。

また、ログイン時に表示されるワードプレスのトップ管理バーのように、position:fixed を持つ通常の div にもこの問題があります。トランジションが進行中の場合、画面がスクロールしません。

これは、(および wp_footer) タグの直前に含まれる私の application.js です。これは、ブートストラップ js ファイル全体の後に含める最後の js ファイルです。

!function ($) {

$(function(){

    var $window = $(window)

     setTimeout(function () {
        $('#af-me').affix({})
        $('#ad-box-1').affix({offset: 580})
    }, 100)

    $('#running-box, #bg-car').carousel({})

    $('#klapp').on('show', function () {
       $("html, body").animate({ scrollTop: $(document).height() }, 365);
         $('#col-switch').text("Becsukni");
    })  

    $('#klapp').on('hide',function () {
       $('#col-switch').text("Kinyitni");

    })  

    $('a').click(function(){
        $('html, body').animate({
            scrollTop: $( $(this).attr('href') ).offset().top
        }, 500);
        return false;
    });

    $('#top').on('click',function () {
       $("html, body").animate({ scrollTop: 0 }, 360);

    })  

    $(".stop-car").hover(
        function(){
            $('#running-box, #bg-car').carousel('pause');           
        },
        function() {

            $('#running-box, #bg-car').carousel('cycle');
        }
    );



})
}(window.jQuery)
4

0 に答える 0