jquery-magnet实现带对齐线磁力吸拖拽效果代码-html代码-BFW代码库

jquery-magnet实现带对齐线磁力吸拖拽效果代码

代码语言：html

所属分类：拖放

代码描述：jquery-magnet实现带对齐线磁力吸拖拽效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">

    <style>
        body {
            margin: 0;
          }
          * { font-size: 3vmin; }
          #lines, #paper {
            position: fixed;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
          }
          #paper {
            display: flex;
            flex-flow: column;
          }
          #tool {
            padding: 1vmin;
            background-color: #eee;
            font-family: monospace;
            line-height: 150%;
          }
          #container {
            flex: 2 2;
          }
          .item { white-space: nowrap; }
          input, button {
            outline: none;
            border: .1vmin solid #666;
            font-family: monospace;
            color: #333;
          }
          input[type=checkbox] {
            width: 3vmin;
            height: 3vmin;
          }
          button { background-color: #eee; }
          button:active { transform: translate(.1vmin, .1vmin); }
          #lines {
            z-index: 1;
            pointer-events: none;
          }
          #lines >* {
            position: absolute;
            width: 1px;
            height: 1px;
            background-color: #999;
            opacity: 0;
          }
          #lines >.show { opacity: .5; }
          #lines .vert {
            transform.........完整代码请登录后点击上方下载按钮下载查看