0

我有一个网页需要图像在页面移动时向下滚动。为了在我的 css 中执行此操作，我为它的类分配了固定的位置值。但是在页面上我有一个页脚。当我滚动到页面底部时，图像重叠并出现在此页脚的顶部。我尝试使用 jQuery 创建一个函数来计算图像在页面上的当前位置，如果该位置超过某个点，则使其停止在该点，而不是继续向下继续页面。但是我不擅长 jQuery，所以我还没有让它工作。

HTML

<!DOCTYPE html>
<html lang=en>
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="example.css">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script src="scrollock.js"></script>
    </head>
    <body>
        <header>
        </header>
        <nav>
            <span class="navlinks">
                <a></a>
                <a></a>
                <a></a>
                <a></a>
                <a></a>
                <a></a>
            </span> 
        </nav>

        //this is the image that needs to move down the page as the user scrolls but stop at a certain point//

        <img class="map" src="Drawing.png" height="200px"></img>

        <section>
        </section>

        <section>
        </section>

        <section>
        </section>  

        //This is where the image needs to stop before//
        <section id="contact">
        </section>
</body>
</html>

CSS：

.map{
    margin-top: 30px;
    position: fixed;

}


#contact{
    width: 100%;
    height: 600px;
    display: block;
    background-image: url(line.png);
    margin-top: 0px;

jQuery：

$(function(){
var image = $('.map');
var top = $('.map').position.top();
    if( top > 300 ){
    image.css('position','absolute');
}else{
 image.css('position','fixed');
};
});

我真的很少知道 jquery 有什么问题，无论是分号在某处丢失还是什么。

任何帮助将不胜感激。

4

1 回答 1

0

您的“if”语句应包含在括号中：

if(conditional_here){

  //if true

}else{

  //if not true

};

此外，使用 Firebug 检查任何此类问题或追溯脚本可能存在的任何错误代码/错误

于 2013-07-29T17:08:04.170 回答