jQuery 锚点定位

阅读 (1865)
共两段,一个是点击锚点的事件,还有一个加载页面时,链接中带有锚点参数,项目中经常会有这样的需求,需要点击锚点定位到指定位置
jQuery(document).ready(function(){
    jQuery("a.anchor,.anchor a").click(function(){
        var url = jQuery(this).attr("href");
        var id = url.split('#')[1];
        if(id){
            if(jQuery(window).width() > 900){ //自适应大小判断,请根据实际项目修改
                var pos = jQuery('#'+id).offset().top-80; //偏移量请自行修改,比如顶部菜单是固定在屏幕顶部的,这里80改成菜单高度
            }else{
                var pos = jQuery('#'+id).offset().top;
            }
            jQuery("html,body").animate({scrollTop: pos}, 1000);
        }

    });


});

jQuery(window).load(function(){
    var url = window.location.toString();
    var id = url.split('#')[1];
    if(id){
        if(jQuery(window).width() > 900){
            var pos = jQuery('#'+id).offset().top-80;//偏移量请自行修改,比如顶部菜单是固定在屏幕顶部的,这里80改成菜单高度
        }else{
            var pos = jQuery('#'+id).offset().top;
        }
        jQuery("html,body").animate({scrollTop: pos}, 1000);
    }
});

 

更新于:2015-05-26 01:27:24
返回顶部