javascript:使用键盘跳到下一张图片
我正在尝试制作用户友好的键盘导航,以便在垂直列表中的图像负载之间跳转。
例如:
<img src="1.jpg"><br>
<img src="x.jpg"><br>
<img src="9.jpg"><br>
<img src="1357.jpg"><br>
<img src="lol.jpg"><br>
我试图使右键盘箭头向下滚动一张图像,而左箭头将向上滚动一张图像。
我首先想到我可以在每个图像上方添加锚点,然后创建一个 JS 函数,当按下键盘箭头时该函数将转到这些锚点。但肯定有一种更聪明、更稳健的方法来做到这一点吗?
im trying to make userfriendly keyboard navigation for jumping between loads of images in a vertical list.
example:
<img src="1.jpg"><br>
<img src="x.jpg"><br>
<img src="9.jpg"><br>
<img src="1357.jpg"><br>
<img src="lol.jpg"><br>
im trying to make the right keyboard arrow scroll down one image, while the left arrow will scroll up one image.
i was first thinking i could add anchors above each image, and then make a JS function that will go to those anchors when the keyboard arrows are pressed. but there surely have to be a more clever and robust way of doing this?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
设置锚点。
引用列表中的锚点。
使用键盘循环浏览列表。
正如您所推荐的那样,这是执行此操作的标准方法。如果您想让它更加健壮,请将所有这些图像放在一个公共类中,并在运行时动态创建列表。
Set anchors.
Reference the anchors in a list.
Use the keyboard to cycle through the list.
As you recommended is the standard way to do it. If you want to make it more robust, then put all of those images in a common class, and dynamically create the list at runtime.