js怎么改变图片位置
3个回答
展开全部
先把图片的父元素的css样式,postion设置为relative,然后图片的postion设置为absolute,然后用js来改变的图片的left 和 top数值就可以改变图片的位置了。如果不设置父元素,那就将图片的postion设置为relative,也可以改变位置,JS同样。
下面是个简单的例子,你参考下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TEST</title>
<style type="text/css">
*{margin: 0; padding: 0;}
.wrap { position: relative; }
#pic { position: absolute; }
</style>
</head>
<body>
<div class="wrap">
<img id="pic" src="222.jpg">
</div>
<script type="text/javascript">
var pic = document.getElementById("pic");
pic.style.left=50+"px"; //这里可以更改图片左边距
pic.style.top=30+"px"; //这里可以更改图片的上边距
</script>
</body>
</html>
<script type="text/javascript">
var pic = document.getElementById("pic");
pic.style.left=150+"px";
pic.style.top=130+"px";
</script>
展开全部
通过js获取你需要操作的图片image标签的id。var img=document.getElementbyId('image1');
修改img对象的位置属性,就可以了。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
.imgclass1{
position :'absolute';
top:50px;
left:100px;
}
.imgclass2{
position :'absolute';
top:100px;
left:300px;
}
<img id = "imgId" class="imgclass1"/>
var a = $("#imgId").hasClass('imgclass1');
if(a){
$('#imgId').removeClass('imgclass1');
$('#imgId').addClass('imgclass2');
}
position :'absolute';
top:50px;
left:100px;
}
.imgclass2{
position :'absolute';
top:100px;
left:300px;
}
<img id = "imgId" class="imgclass1"/>
var a = $("#imgId").hasClass('imgclass1');
if(a){
$('#imgId').removeClass('imgclass1');
$('#imgId').addClass('imgclass2');
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询