0

我在这个网站上谈论带有adsense的左块:http ://www.smejemsa.sk/obrazky/blondinka-v-autoskole/ 。
position: fixed在这种情况下不是一个好的选择,或者我不知道如何在 CSS 中写入。
3display: inline-block; position: relative在前两个和position: absolute最后一个。

我使用这个 javascript 来移动带有广告的左侧块 - 但更快的滚动存在问题。
当我滚动得更快时,块的位置会随机调整。有任何想法吗?
我愿意用 来写这个position: fixed,但我不知道怎么写。

$(document).scroll(function() {
    var pomocna=$(document).scrollTop();
    var vyska=pomocna-315;
    var skrol=$('#content-wrapper').height();

    if ((pomocna <= (skrol-380)) && (pomocna>=310))
        $('#ad-left').css('top',vyska);
});
4

1 回答 1

1

像这样的东西怎么样:

var $left = $('.left-part'),
    leftOff = $left.offset().top,
    leftHeight = $left.height(),
    rightHeight = $('.right-part').height(),
    bottomAlign = rightHeight - leftHeight + leftOff;
$(window).scroll(function(){
    var winScroll = $(window).scrollTop();
    if(winScroll >= leftOff && winScroll < bottomAlign){
        $left.addClass('fixed').removeClass('bottom')
    }else if(winScroll >= bottomAlign){
        $left.removeClass('fixed').addClass('bottom')
    }
    else{
        $left.removeClass('fixed bottom')
    }
})

因为我不喜欢在 JS 中使用固定数字,所以一切都是计算出来的。

这是一个工作演示:JSFiddle

CSS 中的重要部分仅此而已:

#content { position: relative;} 
.left-part { position: absolute; top: 0; left: 0; }
.left-part.fixed { position: fixed; left: auto; }
.left-part.bottom { top: auto; bottom: 0; }
于 2013-08-11T20:11:23.973 回答