2个回答
2019-04-10
展开全部
用js的 event.keyCode来获取方向键。
从网上你可以查到左右方向键对应的keyCode值,这样你就能获取到左右键点击事件了。
然后当左右键点击的时候,触发显示和隐藏对应图片的功能。
图片的显示和隐藏,你可以用js给对应的图片添加显示或者隐藏的css。
这样就能实现你要的效果了
从网上你可以查到左右方向键对应的keyCode值,这样你就能获取到左右键点击事件了。
然后当左右键点击的时候,触发显示和隐藏对应图片的功能。
图片的显示和隐藏,你可以用js给对应的图片添加显示或者隐藏的css。
这样就能实现你要的效果了
追问
有要求用原生js实现...
追答
如果你想简单点,给2张图片设置不同的id
当点击左的时候,给第一张图显示的css,第二张隐藏的css。点击右的时候也添加对应的css。
展开全部
支持多张图片
<html>
<head>
<title>循环</title>
<style>
img {
width: 100px;
}
</style>
</head>
<body>
<div id="divImg">
<img src="https://tb2.bdstatic.com/tb/static-common/img/search_logo_big_v1_8d039f9.png" />
<img src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo_top_86d58ae1.png" style="display: none;" />
<img src="http://s1.bdstatic.com/r/www/cache/mid/static/xueshu/img/logo_4b1971d.gif" style="display: none;" />
</div>
<script type="text/javascript" charset="UTF-8">
var n = 0;
var arr = document.getElementsByTagName('img');
document.onkeydown = function (event) {
for (var i = 0; i < arr.length; i++) {
arr[i].style.display = 'none';
}
var e = event || window.event || arguments.callee.caller.arguments[0];
if (e && e.keyCode == 37) { // 按 <-
n--;
if (n < 0) {
n = arr.length - 1;
}
}
if (e && e.keyCode == 39) { // 按 ->
n++;
if (n >= arr.length) {
n = 0;
}
}
arr[n].style.display = 'block';
};
</script>
</body>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询