视差网站 - Img在我滚动之前不会出现

时间:2012-12-18 23:07:29

标签: jquery css image parallax

在我的site我在第一页上有一个徽标,但在我开始滚动之前它是不可见的?如何让它立刻可见?

这是我的HTML

<div id="introwrapper">
    <div id="intro">
    <!--    <div id="introbaggrundforan"></div>-->
    <div id="introbaggrundbagved"></div>
    <a name="section1" class="section1">SECTION 1</a>
    </div> <!--#intro-->
<div id="logo"></div>

这是我的Css:

#introwrapper {
height: 900px;
position: relative;
overflow: hidden;   
background: transparent url('images/introbagved.png') no-repeat center;
}


#intro{
background: url('images/introforan.png') no-repeat center;
height: 900px;
width: 1440px;
margin: 0;
position: relative;
z-index: 3;
}

#logo{
background: transparent url('images/logo.png') no-repeat center;
width: 400px;
height: 400px;
position: absolute;
margin-left: 520px;
margin-top: 160px;
z-index: 2;
}

这是我的Jquery:

$(document).ready(function(){
            $(window).bind('scroll',function(e){
                parallaxScroll();
            });


            function parallaxScroll(){
                var scrolledY = $(window).scrollTop();
                $('#logo').css('top','+'+((scrolledY*.819))+'px');

1 个答案:

答案 0 :(得分:0)

添加

top:0;

#logo css规则。


问题是你没有为该元素定义一个位置,所以它是相对于前面的元素插入的..那是在#intro div之后。