成长脚印-专注于互联网发展
【解决】IE中iframe中锚点点击导致父页面位置错乱解决方案
post by:天之骄子 2013-4-18 16:54
问题描述(摘抄于某网友的提问):

我在网页中加入了一个iframe,iframe页中有一个锚点设置“#top",当我点击锚点连接时,却把iframe的顶端与浏览器顶端对齐了,而不是将iframe的内容顶端与iframe的顶端对器

 

 问题解决:

上述问题只出现在IE个版本浏览器的iframe中的锚点点击的情况,iframe位置会与浏览器顶部对齐,导致父页面定位错乱。

解决方案很简单,给锚点点击跳转时,绑定一个平滑滚动事件就可以了:

$(".anchor").click(function(){
    var href = $(this).attr("href");
    var pos = $(href).offset().top;
    $("html,body").animate({scrollTop: pos}, 1000);	
    return false;
});
如果锚点已经写好或太多不方便再加class的话,可以用JQ的属性正则选择器解决

$("a[href^=#]").click(function(){
    //选择href以#开头的A标签,即锚点咯
})

评论:
binghu13
2014-07-31 13:57 回复
正是我需要解决的问题,但是我的基础比较差,看不懂,能详细解释一下怎么应用吗?谢谢!
发表评论:
昵称

邮件地址 (选填)

个人主页 (选填)

内容