JS鼠标右键移动批量选中特效代码下载



如需定制开发(网站开发、二次开发)在线咨询,请点击>> QQ:753511799

6 23 8



特效描述:鼠标右键移动 批量选中。JS鼠标右键移动批量选中代码是一款js鼠标框选,拖拽框选元素开删除特效。

代码结构

1. 引入CSS

<link rel="stylesheet" href="static/css/normalize.min.css">
<link rel="stylesheet" href="static/css/style.css">

2. 引入JS

<script src='static/js/flipping.web.js'></script>
<script src='static/js/xstate.js'></script>
<script src='static/js/rxjs.umd.min.js'></script>
<script  src="static/js/script.js"></script>

3. HTML代码

<h2>按下鼠标右键框选</h2>
<div class="ui-week">
  <div class="ui-day" data-day="sun">
    <div class="ui-day-box">
      <div class="ui-bg" data-flip-key="bg-sun"></div>
      <div class="ui-grab -left"></div>
      <div class="ui-day-name" data-flip-key="sun"></div>
      <div class="ui-grab -right"></div>
    </div>
  </div>
  <div class="ui-day" data-day="mon">
    <div class="ui-day-box">
      <div class="ui-bg" data-flip-key="bg-mon"></div>
      <div class="ui-grab -left"></div>
      <div class="ui-day-name" data-flip-key="mon"></div>
      <div class="ui-grab -right"></div>
    </div>
  </div>
  <div class="ui-day" data-day="tue">
    <div class="ui-day-box">
      <div class="ui-bg" data-flip-key="bg-tue"></div>
      <div class="ui-grab -left"></div>
      <div class="ui-day-name" data-flip-key="tue"></div>
      <div class="ui-grab -right"></div>
    </div>
  </div>
  <div class="ui-day" data-day="wed">
    <div class="ui-day-box">
      <div class="ui-bg" data-flip-key="bg-wed"></div>
      <div class="ui-grab -left"></div>
      <div class="ui-day-name" data-flip-key="wed"></div>
      <div class="ui-grab -right"></div>
    </div>
  </div>
  <div class="ui-day" data-day="thu">
    <div class="ui-day-box">
      <div class="ui-bg" data-flip-key="bg-thu"></div>
      <div class="ui-grab -left"></div>
      <div class="ui-day-name" data-flip-key="thu"></div>
      <div class="ui-grab -right"></div>
    </div>
  </div>
  <div class="ui-day" data-day="fri">
    <div class="ui-day-box">
      <div class="ui-bg" data-flip-key="bg-fri"></div>
      <div class="ui-grab -left"></div>
      <div class="ui-day-name" data-flip-key="fri"></div>
      <div class="ui-grab -right"></div>
    </div>
  </div>
  <div class="ui-day" data-day="sat">
    <div class="ui-day-box">
      <div class="ui-bg" data-flip-key="bg-sat"></div>
      <div class="ui-grab -left"></div>
      <div class="ui-day-name" data-flip-key="sat"></div>
      <div class="ui-grab -right"></div>
    </div>
  </div>
</div>
<div class="ui-alert"><span class="ui-alert-days"></span><span> days removed</span></div>
<div class="ui-trash">
  <div class="ui-trash-lid"></div>
  <div class="ui-ridges"></div>
  <div class="ui-sparks">
    <div class="ui-spark"></div>
    <div class="ui-spark"></div>
    <div class="ui-spark"></div>
  </div>
</div>
<div class="ui-selection"></div>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器:Chrome、FireFox、360、搜狗、Opera、傲游. 不支持Windows版Safari、IE8及以下浏览器。</p>
<p>来源:<a href="http://sc.51qianduan.com/" target="_blank">站长素材</a></p>
</div>



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



×
×
51前端

注册

×
绑定手机

请绑定手机号,在继续操作

×
单次下载支付

应付金额:279

支付完成后,回到下载页面,在进行下载

官方QQ群
意见反馈
qq群

扫描上面二维码加微信群

官方QQ群

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

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