0

我的 HTML 中有一个 javascript 代码。这是代码:

<body>
<div id="div_inner_title">
    <img class="img_title" src="../common/img/header_logo.png"></img>
    <a id="menuId"><img class="img_menu" src="img/btn_menu.png"></img></a>                     
    <script type='text/javascript'>
    $(document).ready(function (){
        $("#menuId").click(function (){
        $('html, body').animate({
            scrollTop: $("#div_menu_links").offset().top
        }, 1000);
        });
});</script>
</div>
.
.
.
.
.<!--Somewhere really below is a menu-->
.
.
<div class="div_menu_links">
    <a href="....">
        <img src="../common/img/menu_01.png" class="img_menu_button"></img>
    </a>
    <img class="img_menu_line_button" src="../common/img/menu_line.gif"></img>
<a href="....">
        <img src="../common/img/menu_02.png" class="img_menu_button"></img>
    </a> 
<img class="img_menu_line_button" src="../common/img/menu_line.gif" ></img>
<a href="....">
        <img src="../common/img/menu_03.png" class="img_menu_button"></img>
    </a> 
<img class="img_menu_line_button" src="../common/img/menu_line.gif"></img>
 <a href="....">
        <img src="../common/img/menu_04.png"class="img_menu_button"></img>
    </a>        
</div>
</body>

我真正想做的是当用户使用javascript单击图像按钮时,div菜单显示在屏幕上(因为它位于实际网站的下方)。但是,上面的代码不起作用。只是为了获得更多信息,从图像按钮到 div 菜单的“转移”具有动画效果。

老实说,我不是超级天才程序员,所以请帮帮我。这是我页面上唯一没有工作的东西。谢谢!

4

1 回答 1

1

检查这个简单的示例并尝试实现相同的目标:

http://jsfiddle.net/kxGRN/2/

HTML

<a href="#" id="menuId">Go Down</a>

<div id="div_menu_links">
    Reached the bottom menu! :)
</div>

CSS

// Just for demonstration
#div_menu_links { margin-top:2000px;}

查询

$(document).ready(function (){
    $("#menuId").on("click", function (e){
        e.preventDefault();
        $('html, body').animate({
            scrollTop: $("#div_menu_links").offset().top
        }, 1000);
    });
});

一张纸条

不要依赖他人来检测您的错误。通过这个简单的教程开始学习如何使用firebugFirebug 教程

于 2013-04-15T05:40:28.487 回答