博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML5 元素拖动
阅读量:5934 次
发布时间:2019-06-19

本文共 405 字,大约阅读时间需要 1 分钟。

1、拖动元素img的相关设置:

  设置元素可以拖动属性

draggable="true"

  设置元素被拖动时触发的事件

οndragstart="drag(event)"

图片元素可拖动的完整代码

HTML:

Javascript:

2、设置允许拖动对象放置的元素div:

  允许拖动图片放置在div内,阻止对事件的默认处理方式,在div内添加属性

οndragοver="allowDrop(event)"

  放置时触发的事件

οndrοp="drop(event)"

div元素可放置拖动img的完整代码

HTML:

Javascript:

3、把两张图片img拖动到一个div中,并排放置完整代码

HTML:

    

CSS:

Javascript:

 

转载于:https://www.cnblogs.com/heyuheitong/p/3999045.html

你可能感兴趣的文章
java实现双向循环链表
查看>>
如何使用缓存提高程序性能
查看>>
【trie树】HDU4825 Xor Sum
查看>>
服务器搭建4 安装其它库
查看>>
CAD绘制栏杆5.10
查看>>
自动化学习
查看>>
JS中的!=、== 、!==、===的用法和区别。
查看>>
vs2017 增加平台集
查看>>
Kinect+OpenNI学习笔记之10(不需要骨骼跟踪的人体多个手部分割)
查看>>
spring mvc(4)处理模型数据
查看>>
jdom解析
查看>>
JS 判断当前使用浏览器名及版本
查看>>
【Kernal Support Vector Machine】林轩田机器学习技术
查看>>
很全的SQL注入语句,有SQL漏洞的都可以拿下
查看>>
SQLServer相关概念
查看>>
CSS+DIV学习笔记——页面布局
查看>>
黄聪:Windows+PHP7+ImageMagick
查看>>
java——万年历
查看>>
java设计模式-策略模式
查看>>
013_面向对象_抽象类和接口
查看>>