JQuery：缩略图根据鼠标位置自动滚动
我试图让一行缩略图根据鼠标所在的位置在其 DIV 内自动滚动。我在此处找到了我想要的示例，但无法提取/编辑 JavaScript使其正常工作。 这里是我失败的尝试。 :(
我需要父 DIV 来填充页面的整个宽度（即 100%）。最终，如果我做对了，我想在页面上添加多个自动滚动缩略图 DIV。
抱歉，如果代码不好，我对 JavaScript 的了解糟糕。
I'm trying to make a row of thumbnails scroll automatically within their DIV depending on where the mouse is. I found an example of what I'm after here, but can't extract/edit the JavaScript to make it work properly. Here is my failed attempt. :(
I need the parent DIV to fill the full width of the page (i.e.100%). Eventually, if I get this right, I would like to add more than one auto scrolling thumbnail DIV on a page.
Sorry if the code is bad, my knowledge of JavaScript is abysmal.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
尽管你混淆了 javascript 和 perl 变量等，但你已经非常接近了。
一些注意事项：
$用作jQuery的别名。因此，$()与jQuery()相同。它不是像 perl 中那样的变量标识符。$div应为$('div')，但如果您立即要调用children()，则它不是很有用> 或find()。相反，$('div.album')不要使用
63 * number_of_elements计算宽度，而是使用 jQuery 使用.outerWidth 获取其实际宽度（正确）。true意味着它包含边距。这是一个基于您的代码的工作示例：
http://jsfiddle.net/jtbowden/BAjQB/
我添加了变量
leftBuffer和rightBuffer来限制滚动，这样您就不必在最边缘的像素上一直向左/向右滚动。You were pretty close, although you had a mismash of javascript and perl variables, etc.
Some notes:
$is used as an alias forjQuery. So,$()is the same asjQuery(). It is not a variable identifier like in perl.$divshould be$('div'), but it is not very useful if you are immediately going to callchildren()orfind(). Instead do$('div.album')Instead of calculating the width using
63 * number_of_elements, use jQuery to get their actual widths using.outerWidth(true). Thetruemeans it includes margins.Here is a working example based off your code:
http://jsfiddle.net/jtbowden/BAjQB/
I added variables
leftBufferandrightBufferwhich constrain the scrolling so that you don't have to be on the very edge pixel to scroll all the way left/right.