我正在为朋友开发一个单页的婚礼网站。它使用以下jQuery在单击导航点时向页面添加"平滑滚动"效果。
我将为 iPad 和 iPhone 添加自适应布局 - 但他们渴望尽快推出它,我需要继续邀请!
无论如何,我在 iPad 上遇到了奇怪的行为 - 由于平滑滚动仅适用于您单击的第一个链接 - 然后没有任何 nab 链接触发行为/似乎可点击。
我假设这是固定导航的问题 - 但是它可以在我测试过的所有其他 (mac) 浏览器和我的 iPhone 中工作。
网站在这里
http://www.elandsebswedding.co.uk/main-page/
jQuery在这里:
$("nav ul li a, #logo a").click(function(event){
//prevent the default action for the click event
event.preventDefault();
var full_url = this.href;
var parts = full_url.split("#");
var trgt = parts[1];
var target_offset = $("#"+trgt).offset();
var target_top = target_offset.top;
$('html, body').animate({scrollTop:target_top -130}, 500);
});
任何建议/解决方法将不胜感激!
这是移动 Safari 的一个问题。
解决它的一种黑客方法是使用动画回调将某些内容附加到 DOM。
$('html, body').animate({scrollTop:target_top -130}, 500, function(){
$('body').append('<div id="device-dummy" style="height: 1px;"></div>');
});
你可能会发现这个jQuery插件很有用https://github.com/jamesmusgrave/jQuery-One-Page-Nav