ブートストラップでワードプレスのテーマを作成しました。カルーセルと接辞を使用しています。
現在、カルーセルがスライドを変更すると、.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)