<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
img{
width: 600px;
height: 600px;
}
#one{
overflow: hidden;
width: 300px;
height: 300px;
}
</style>
</head>
<body>
<div id="one">
<img src="img/5.jpg"/>
</div>
<button id="btn">点击</button>
</body>
</html>
<script type="text/javascript">
//标签的内容滚动 这个属于DOM操作
//使用场景 :放大镜
//scrollLeft scrollTop 即可赋值
//
var l=20;
btn.onclick=function(){
one.scrollLeft=l;//点击向左移动20
one.scrollTop=l;//点击向上移动20
console.log(one.scrollLeft);
console.log(one.scrollTop);
l+=20;
}
</script>
js中标签的滚动属性
最新推荐文章于 2023-11-28 15:23:18 发布