原生js图片拖拽鼠标点击拖拽图片调整位置效果代码



146 582 195



特效描述:图片拖拽 鼠标点击拖拽 图片调整位置,

代码结构

1. 引入CSS

<link href="style/style.css" rel="stylesheet" type="text/css" />

2. 引入JS

<script type="text/javascript" src="js/Drag.js"></script>
<script type="text/javascript" src="js/script.js"></script>

3. HTML代码

<ul id="ul_container">
	<li id="pic1" style="z-index:3;"><img src="images/1.jpg" alt="www.17sucai.com" /></li>
	<li id="pic2" style="z-index:1;"><img src="images/2.jpg" alt="www.17sucai.com" /></li>
	<li id="pic3" style="z-index:5;"><img src="images/3.jpg" alt="www.17sucai.com" /></li>
	<li id="pic4" style="z-index:4;"><img src="images/4.jpg" alt="www.17sucai.com" /></li>
	<li id="pic6" style="z-index:3;"><img src="images/5.jpg" alt="www.17sucai.com" /></li>
	<li id="pic7" style="z-index:2;"><img src="images/6.jpg" alt="www.17sucai.com" /></li>
	<li id="pic8" style="z-index:5;"><img src="images/7.jpg" alt="www.17sucai.com" /></li>
</ul>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 图片拖动 图片放大镜 图片叠加 图片翻转旋转 图片延迟加载 图片淡出淡进 图片全屏 图片头像上传 二维码 图片广告 图片放大缩小 html5图片动画 带缩略图的幻灯片 地图 拖动拽动 图片滚动 图片滑动 图片切换 图片收缩展开 旋转木马 图片轮播 自动滚动图片轮播 图标导航菜单 背景切换 手风琴 图表 图片 头像截图 图片拖动 图片墙

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到