想要保持背景固定,直到某个向下滚动点

时间:2014-03-05 13:22:08

标签: javascript jquery css

我有两张背景照片,我想显示第一张背景照片,如果页面没有滚动到500,如果页面滚动超过500,那么我想要显示第二张背景,两个背景必须定位固定并伸展到屏幕上。

当页面滚动时,只有文本必须移动,如果scoll超过500,则背景必须改变。

http://jsfiddle.net/2Pfsy/37/

    $(document).ready(function () {
        var imageControl = function (event) {
            var fromTop = $(window).scrollTop();
            url = null;
            console.log(fromTop);
            if (fromTop < 500) {
                url = 'http://i.hizliresim.com/KdrGVV.png';
            } else if (fromTop > 500) {
                url = 'http://4.bp.blogspot.com/-mHaVHhUegKs/UjHp6DruPeI/AAAAAAAAGx8/m_je_crr1v0/s1600/wp+cortana+screenshot+mashup.jpg';
            }

            $('body').css('background', 'url(' + url + ')');
        };
        $(window).scroll(imageControl);
    });

1 个答案:

答案 0 :(得分:2)

http://jsfiddle.net/2Pfsy/43/

更新了你的jsfiddle

在js中将背景更改为background-image,并在css中添加background-attachment: fixed