滚动时仅更改背景中的y位置

时间:2011-10-15 08:47:15

标签: jquery

  

可能重复:
  Changing only y pos of background image via Jquery

我想在滚动并保持x位置一致的情况下,仅更改.nav-logo的backournd的y位置。 我已经实现了这样,但没有得到结果。 这是我的使用代码

jQuery(document).ready(function($) {
a=parseFloat(-28);// valor inccial para el background 1
b=parseFloat(1);// valor inccial para el background 1

var scrollTop = $(window).scrollTop();          
var scroll_actually= new Array();// identifica los valoares del background X y  Y

$(window).scroll(function(){//this is not the cleanest way to do this, I'm just keeping it short.
    if(scrollTop>$(this).scrollTop()) // desplazamiento hacia arriba
    {
        if (getScrollTop()<=100 && getScrollTop()>=0)// identyifica cuando la posicion del background_1 esta en scroll
        {
                a=a+1;// posicion del background1 decrementa en 1 pixeles
                b=b+1;// posicion de background1 decrementa en 1 pizeles 
                $('a.qa-logo-link').css('top', +a+'px');
                $('.nav-logo a').css('background-position', -1+'px' , 0+b+'px');    // i think something is wrong here  
        }

    }scrollTop = $(this).scrollTop();});
});
function getScrollTop(){ 



   if(typeof pageYOffset!= 'undefined'){
        //most browsers
        return pageYOffset;
    }
    else{
        var B= document.body; //IE 'quirks'
        var D= document.documentElement; //IE with doctype
        D= (D.clientHeight)? D: B;
        return D.scrollTop;
    }
}

我的css文件是

.nav-logo a{
background:url("logo1.png") no-repeat scroll  transparent;
background-position:-1px 1px;}

1 个答案:

答案 0 :(得分:0)

如果您想将.nav-logo保持在静态位置,请使用css position:fixed;position:absolute;并提供左值和最高值。

<强>更新

更新了您的示例

http://jsfiddle.net/SbuxT/9/