草庐IT

anchor-scroll

全部标签

javascript - 有效地听 JS .scroll()

我有一个包含许多子项的可滚动元素和一个带有相应选项的选择标签。我想根据元素.scrollTop()更改select的值如何高效地做到这一点?我考虑过将children的.offset().top存储在一个数组中并循环遍历它。但是,浏览器不处理它。我可能会尝试创建一个.setTimeout()标志,但这看起来并不干净。r=$('ul')offsets=[]r.find('li').each((index)->offsets[index]=$(this).offset().top)r.bind('scroll',->//whileloopchecking.scrollTop()>offse

Javascript:没有 anchor (哈希)部分的 document.url

我已经尝试搜索了30分钟,如果已经有人问过,我深表歉意。我有一些Ajax,它返回一组结果,当单击一个结果时,它只是将带有附加数据的URL重新加载到URL,以便PHP在下一页上获取GET。问题是,如果用户点击了一些内置anchor(我无法删除),URL将是something.com#location1所以附加?action=next将将其转换为something.com#location1?action=next,浏览器会将其解释为长anchor,而不是实际指向的新URL。如果用户从不点击anchor部分,则使用window.location=document.url+"?action=

javascript - 事件目标应该是 anchor ,而不是图像

我正在使用VanillaJS编写对话脚本。我遇到了视频图像上点击事件的问题。即使图像被anchor标记包围,它也会将图像显示为“trigger-dialog-open”事件的event.target。这是HMTL:这是JS中的事件:varopenTriggers=document.getElementsByClassName('trigger-dialog--open');for(vari=0;i事件处理程序想从anchor数据属性中获知对话ID。它找不到,因为它认为图像是event.target,而不是实际的anchor。我该如何纠正这个问题?谢谢! 最佳

javascript - 基于 scroll React JS 的 Toggle 类

我正在使用bootstrap4导航栏,想在ig400px向下滚动后更改背景颜色。我正在查看react文档并找到了一个onScroll但找不到那么多信息。到目前为止,我已经...我不知道我是否使用了正确的事件监听器或如何设置高度等。而且我并没有真正设置内联样式...importReact,{Component}from'react';classAppextendsComponent{constructor(props){super(props);this.state={scrollBackground:'nav-bg'};this.handleScroll=this.handleScro

javascript - 当event.target 为HTMLImageElement 时,如何获取anchor 的href?

我想在单击时获取anchor元素的href。我正在使用以下javascript代码:document.addEventListener('click',function(event){event=event||window.event;varel=event.target||event.srcElement;if(elinstanceofHTMLAnchorElement){console.log(el.getAttribute('href'));}},true);这非常适合像这样的嵌入式anchor:但是当我使用anchor和图像时它不起作用:event.target返回图像而不是a

javascript - $(window).scroll 不准确,快速滚动时

我试图操纵元素的位置,所以在某些页面滚动位置之间,他的css发生了变化。看看这个简单的例子:http://jsfiddle.net/6RtTX/8/问题是-$(window).scroll不是那么准确,所以如果我滚动得非常快,它就会变得非常困惑。这个问题有解决办法吗?我可以在$(window).scroll方法中对这些操作进行排队吗?提前致谢。 最佳答案 试着像这样改变你的fiddle的代码:$(window).scroll(function(event){if(event.pageY>100&&event.pageY通过使用传递的

javascript - -webkit-overflow-scrolling 打破了绝对定位

我正在构建一个页面,该页面需要一些元素在页面顶部滚动,否则它们会滚动到屏幕之外。我设法使用position:absolute做到了这一点。一切都运行良好,但它需要动量滚动。我将-webkit-overflow-scrolling:touch添加到可滚动区域的css中。这打破了一切。我的带有position:absolute的粘性元素现在只是与其余内容一起滚动。我的问题是:为什么-webkit-overflow-scrolling:touch会影响绝对定位,有没有办法解决这个问题?更新:每当子元素变为“固定”或“未固定”时,我都会添加一个警报。警报继续触发,因此样式仍在应用,只是不起作用

javascript - 是否可以在 Angular.js 应用程序中使用传统的 anchor 链接

Angular.js路由创建如下URL:http://cooldomain.com:3000/#/searchhttp://cooldomain.com:3000/#/docs在我的文档url中,我希望有一个很长的页面部分和带有anchor链接的传统目录,以便用户可以在页面上跳转从概念上讲,目录会产生大量无效的URL,例如http://cooldomain.com:3000/#/docs#coolAPIFunction由于双哈希,这当然行不通那么-是否可以在具有路由的Angular.js应用程序中使用anchor链接? 最佳答案 您

javascript - .scroll() 函数在上次更新后在 google chrome 中定位闪烁

说实话,我有点绝望。在我的GoogleChrome浏览器更新之后——我认为是版本39到41——我的一个客户网站在Chrome中完全毁容了。你可以在这里看到:http://prinovis-media-day.com/如果向下滚动,所有»parallax«元素都会闪烁。我已经在我的macbook版本39上检查过了——它在版本39中绝对没问题。基本上,我为创建这种效果所做的工作非常简单:$("window").scroll(function(){varmove_value=Math.round(scroll_top*0.3);varopacity_value=*someothervalue

javascript - Ctrl 或 Shift 对每个浏览器中 anchor 标记的 `onclick` 事件的影响

我最近发现当按下Control或Shift键时,不同的浏览器会以不同的方式处理onclick事件。他们在通过单击鼠标中键跟踪链接的行为上存在相似的分歧。通过以下链接:gotoexample.comOnclick浏览器支持表MouseKeyboardChromeFirefoxSafariOperaIE5.5IE6IE7IE8IE9LeftNoneyesyesyesyesyesyesyesyesyesLeftCtrlyesyesyesyes?yesnono?LeftShiftyesyesyesyes?yesyesyes?MiddleNoneyesnoyesno?N/Anono?有人可以帮我