![](/img/trans.png)
[英]How can I display a page in the browser, only after it has fully loaded AND jumped to a vertical offset position?
[英]How can I tell if a page has jumped to the anchor (#) in javascript?
我有一些javascript可以出现在许多不同的页面上。 有时这些页面是通过包含锚引用的URL访问的(例如#comment-100)。 在那些情况下,我希望javascript延迟执行,直到窗口跳转。 现在我只是使用延迟,但这非常hackish,显然在所有情况下都不起作用。 我似乎无法找到任何与窗口“跳转”相对应的DOM事件。
除了简单的延迟之外,我提出的唯一解决方案是让JS在URL中查找锚点,如果找到了,请注意scrollTop中的更改。 但这似乎有些错误,而且我不能100%确定我的脚本在滚动发生之前总会被触发,因此只有在用户手动滚动页面时它才会运行。 无论如何,我真的不喜欢这个解决方案而且更喜欢更多事件驱动的东西。 有什么建议?
编辑澄清:
我不是想检测哈希变化。 请看以下示例:
我正在尝试可靠地检测第5步发生的时间。
您可以在现代浏览器中查看window.onhashchange。 如果您想要交叉兼容,请查看http://benalman.com/projects/jquery-hashchange-plugin/
此页面还有关于window.onhashchange的更多信息。
编辑:你基本上用类似的链接约定替换所有锚名称,然后使用.scrollTo来处理滚动:
$(document).ready(function () {
// replace # with #_ in all links containing #
$('a[href*=#]').each(function () {
$(this).attr('href', $(this).attr('href').replace('#', '#_'));
});
// scrollTo if #_ found
hashname = window.location.hash.replace('#_', '');
// find element to scroll to (<a name=""> or anything with particular id)
elem = $('a[name="' + hashname + '"],#' + hashname);
if(elem) {
$(document).scrollTo(elem, 800,{onAfter:function(){
//put after scroll code here }});
}
});
请参阅jQuery:调用URL时滚动到锚点,替换浏览器行为以获取更多信息。
好像你可以使用window.onscroll
。 我刚刚测试了这段代码:
<a name="end" />
<script type="text/javascript">
window.onscroll = function (e) {
alert("scrolled");
}
</script>
这似乎工作。
编辑:嗯,它在IE8中不起作用。 它适用于Firefox和Chrome。
编辑:jQuery有一个.scroll()
处理程序,但它在浏览IE之前触发,似乎不适用于Chrome或Firefox。
要检测元素何时出现在屏幕上,请使用出现的插件:
$('#comment-1').appear(function() {
$(this).text('scrolled');
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.