获取特定div以查看或滚动到视图中

时间:2013-02-27 10:36:31

标签: javascript jquery

我正在尝试添加一个功能到我的网站,当我点击一个链接,我希望一个特定的div元素进入为用户查看..香港专业教育学院尝试过代码

$(".testClick").live("click",function(e){
  e.preventDefault(); 
      // Call the scroll function
    goToByScroll("indID13");
});


 function goToByScroll(id){
      // Reove "link" from the ID
    id = id.replace("link", "");
      // Scroll
    $('html,body').animate({
        scrollTop: $("#"+id).offset().top},
        'slow');
}

但这不起作用...是否有可能通过纯jquery本身的任何插件实现此功能..或者我应该使用任何插件... 我将添加一个我尝试过的样本。 jsfiddle链接http://jsfiddle.net/xFu3M/

并尝试这个太太http://jsfiddle.net/xFu3M/6/这是一个bug ..我试图让div 1进入查看并且它已经在视图中,所以当我点击链接时它会显示其他一些div

2 个答案:

答案 0 :(得分:2)

你刚刚遇到语法错误,将.live更改为.on,因为.live在jQuery的更高版本中已经折旧使用它并且它将起作用:

$(".testClick").on("click",function(e){...

查看此编辑的小提琴jsFiddle

答案 1 :(得分:0)

尝试

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">

    $(document).ready(function()
    {
        $(".wrapper").css({"width" : $(window).width() , "height" :  $(window).height()});
        $(".testClick").on("click",function(e)
        {
            e.preventDefault(); 
            goToByScroll("indID13");
        });
    });

    function goToByScroll(id)
    {
        id = id.replace("link", "");
        $('html,body').animate(
        {
            scrollTop: $("#"+id).offset().top
        },'slow');
    }

</script>

点击事件代码未被document.ready包围。

同样使用.on代替.live,因为它已经从现在开始折旧。