先把图片的父元素的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>
用JavaScript实现图片点击放大再次点击恢复代码如下：JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML网页上使用，用来给HTML网页增加动态功能。
拓展内容：JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。
在1995年时，由Netscape公司的Brendan Eich，在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作，Netscape管理层希望它外观看起来像Java，因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。
为了取得技术优势，微软推出了JScript，CEnvi推出ScriptEase，与JavaScript同样可在浏览器上运行。为了统一规格，因为JavaScript兼容于ECMA标准，因此也称为ECMAScript。
鼠标右键点击不显示的图片，选择审查元素（或检查）。在出来的控制台中，右键点击控制台中图片的src属性的链接，选择新窗口打开图片。在新窗口打开的图片依旧不显示，那肯定是你的图片不存在，或路径错误。
