jquery – 当鼠标位于容器外时,谷歌日历如何实现滚动？

正如你在下面的 video中看到的那样,当鼠标位于事件容器之外时,当鼠标上移时它仍然向上滚动到向上,当鼠标移到底部时它仍然向下滚动.

我需要在下面的demo中实现相同的功能.但现在它看起来像following.你可以看到滚动是丑陋的.

请帮我.我怎么能在谷歌日历中为我的演示日历实现滚动？

解决方法

在Chrome和Safari(经测试的Chrome 43.0.2357.81和Safari 8.0.6)中,日视图和周视图在ID为“scrolltimedeventswk”的DIV中显示事件.检查scrolltimedeventswk元素,您可以看到矩形滚动条实际上​​是本机滚动条,使用WebKit伪元素进行大量样式设置原生滚动条样式.见： https://www.webkit.org/blog/363/styling-scrollbars/

知道这一点,通过设置scrolltimedeventswk元素的scrollTop来完成更改垂直滚动位置.要实现像Google日历一样的动画滚动,可以在’mousedown’上设置一个间隔,只需将scrollTop减少/增加一小部分直到达到顶部/底部.可以在’mouseup’上清除间隔.

以下是这种“平滑滚动”技术的示例：
http://www.sitepoint.com/scroll-smoothly-javascript/请注意,在这篇博客文章中,作者正在开发代码,以便在点击时滚动滚动,例如在点击时滚动到页面顶部的链接.然而,该技术是相同的.

原文地址：https://www.jb51.cc/jquery/177476.html