为了账号安全,请及时绑定邮箱和手机立即绑定

取消页面中的图片拖拽效果以及取消文字的选中效果

标签:
Html/CSS Html5
在拖动目标上触发事件 (源元素):
ondragstart - 用户开始拖动元素时触发
ondrag - 元素正在拖动时触发
ondragend- 用户完成元素拖动后触发
        释放目标时触发的事件:
ondragenter- 当被鼠标拖动的对象进入其容器范围内时触发此事件
ondragover- 当某被拖动的对象在另一对象容器范围内拖动时触发此事件
ondragleave- 当被鼠标拖动的对象离开其容器范围内时触发此事件
ondrop- 在一个拖动过程中,释放鼠标键时触发此事件

以上为我们鼠标拖拽图片或者连接时触发(可能用到)的函数,有点像hover或者是click事件,是不是感觉感觉很简单?

注意,下面才是干货:
   <body ondragstart="return false"></body> //取消图片拖拽效果
附上我一般使用的初始化方法,既无法选中文字,在鼠标在文字悬停时鼠标指针也无法变化。
 * {
        padding: 0;
        margin: 0 auto;
        -moz-user-select: none;
        -o-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
        cursor: default;
    }
以上两步,可以让我们做出的网页让人看不出哪些是图片哪些是文字,是不是简单粗暴。

版权声明:本文为博主原创文章,未经博主允许不得转载。

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消