• 拖拽插件jquery.dad.js


     

     带删除功能:

    <!DOCTYPE html>            
    <html>            
    <head>            
        <meta charset="UTF-8">            
        <title>拖拽插件jquery.dad.js</title>         
        <style type="text/css">
            .dad-noSelect,.dad-noSelect *{
                -webkit-touch-callout: none;
                -webkit-user-select: none;
                -khtml-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
                cursor: -webkit-grabbing !important;
                cursor: -moz-grabbing !important;
            }
     
            .dad-container{
                position: relative;
                -webkit-touch-callout: none;
                -webkit-user-select: none;
                -khtml-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
            }
            .dad-container::after{
                content: '';
                clear: both !important;
                display: block;
            }
            .dad-active .dad-draggable-area{
                cursor: -webkit-grab;
                cursor: -moz-grab;
            }
            .dad-draggable-area>*,.dad-draggable-area img{
                pointer-events: none;
            }
            .dads-children.active{
                pointer-events: none;
            }
            .dads-children-clone{
                opacity: 1;
                z-index: 9999;
                pointer-events: none;
            }
            .dads-children-placeholder{
                pointer-events: none;
                overflow: hidden;
                position: absolute !important;
                box-sizing: border-box;
                border:4px dashed #639BF6;
                margin:5px;
                text-align: center;
                color: #639BF6;
                font-weight: bold;
            }    
            .daddy>div {
                box-sizing: border-box;
                 20%;
                padding: 5px;
                float: left;
                display: block;
                position: relative;
            }
            .daddy>div>div {
                display: block;
                height: 120px;
                line-height: 120px;
                text-align: center;
                font-size: 30px;
                font-weight: bold;
                background: #639BF6;
                color: white;
                font-family: "Arial", sans-serif;
            }
            .m-delete{pointer-events: auto;}
        </style>
    </head>            
    <body>    
    ccs文件和js文件可以去GitHub上下载,下载地址是:https://github.com/williammustaffa/jquery.dad.js
    本实例是直接把源代码都复制过来了
        <div id="daddy" class="dad daddy">
            <div>
                <div>1</div>
                <input type="button" value="删除" class="m-delete js-delete">
            </div>
            <div>
                <div>2</div>
                <input type="button" value="删除" class="m-delete js-delete">
            </div>
            <div>
                <div>3</div>
                <input type="button" value="删除" class="m-delete js-delete">
            </div>
            <div>
                <div>4</div>
                <input type="button" value="删除" class="m-delete js-delete">
            </div>
            <div>
                <div>5</div>
                <input type="button" value="删除" class="m-delete js-delete">
            </div>
        </div>
        <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>  
        <!-- <script src='jquery.dad.js'></script>    -->
        <script type="text/javascript">
            /*!
             * jquery.dad.js v1 (http://konsolestudio.com/dad)
             * Author William Lima
             */
     
            (function ($) {
              'use strict';
              var supportsTouch = 'ontouchstart' in window || navigator.msMaxTouchPoints;
     
              $.fn.dad = function (opts) {
                var _this = this;
     
                var defaults = {
                  target: '>div',
                  draggable: false,
                  placeholder: '',
                  callback: false,
                  containerClass: 'dad-container',
                  childrenClass: 'dads-children',
                  cloneClass: 'dads-children-clone',
                  active: true,
                };
     
                var options = $.extend({}, defaults, opts);
     
                $(this).each(function () {
                  var active = options.active;
                  var $daddy = $(this);
                  var childrenClass = options.childrenClass;
                  var cloneClass = options.cloneClass;
                  var jQclass = '.' + childrenClass;
                  var $target = $daddy.find(options.target);
                  var placeholder = options.placeholder;
                  var callback = options.callback;
                  var dragClass = 'dad-draggable-area';
                  var holderClass = 'dads-children-placeholder';
     
                  // HANDLE MOUSE
                  var mouse = {
                    x: 0,
                    y: 0,
                    target: false,
                    clone: false,
                    placeholder: false,
                    cloneoffset: {
                      x: 0,
                      y: 0,
                    },
                    updatePosition: function (e) {
                      this.x = e.pageX;
                      this.y = e.pageY;
                    },
     
                    move: function (e) {
                      this.updatePosition(e);
                      if (this.clone !== false && _this.target !== false) {
                        this.clone.css({
                          left: this.x - this.cloneoffset.x,
                          top: this.y - this.cloneoffset.y,
                        });
                      }
                    },
                  };
     
                  $(window).on('mousemove touchmove', function (e) {
                    var ev = e;
     
                    if (mouse.clone !== false && mouse.target !== false) e.preventDefault();
     
                    if (supportsTouch && e.type == 'touchmove') {
                      ev = e.originalEvent.touches[0];
                      var mouseTarget = document.elementFromPoint(ev.clientX, ev.clientY);
     
                      $(mouseTarget).trigger('touchenter');
                    }
     
                    mouse.move(ev);
                  });
     
                  $daddy.addClass(options.containerClass);
     
                  if (!$daddy.hasClass('dad-active') && active === true) {
                    $daddy.addClass('dad-active');
                  };
     
                  _this.addDropzone = function (selector, func) {
                    $(selector).on('mouseenter touchenter', function () {
                      if (mouse.target !== false) {
                        mouse.placeholder.css({ display: 'none' });
                        mouse.target.css({ display: 'none' });
                        $(this).addClass('active');
                      }
                    }).on('mouseup touchend', function () {
                      if (mouse.target != false) {
                        mouse.placeholder.css({ display: 'block' });
                        mouse.target.css({ display: 'block' });
                        func(mouse.target);
                        dadEnd();
                      };
     
                      $(this).removeClass('active');
                    }).on('mouseleave touchleave', function () {
                      if (mouse.target !== false) {
                        mouse.placeholder.css({ display: 'block' });
                        mouse.target.css({ display: 'block' });
                      }
     
                      $(this).removeClass('active');
                    });
                  };
     
                  // GET POSITION FUNCTION
                  _this.getPosition = function () {
                    var positionArray = [];
                    $(this).find(jQclass).each(function () {
                      positionArray[$(this).attr('data-dad-id')] = parseInt($(this).attr('data-dad-position'));
                    });
     
                    return positionArray;
                  };
     
                  _this.activate = function () {
                    active = true;
                    if (!$daddy.hasClass('dad-active')) {
                      $daddy.addClass('dad-active');
                    }
     
                    return _this;
                  };
     
                  // DEACTIVATE FUNCTION
                  _this.deactivate = function () {
                    active = false;
                    $daddy.removeClass('dad-active');
                    return _this;
                  };
     
                  // DEFAULT DROPPING
                  $daddy.on('DOMNodeInserted', function (e) {
                    var $thisTarget = $(e.target);
                    if (!$thisTarget.hasClass(childrenClass) && !$thisTarget.hasClass(holderClass)) {
                      $thisTarget.addClass(childrenClass);
                    }
                  });
     
                  $(document).on('mouseup touchend', function () {
                    dadEnd();
                  });
     
                  // ORDER ELEMENTS
                  var order = 1;
                  $target.addClass(childrenClass).each(function () {
                    if ($(this).data('dad-id') == undefined) {
                      $(this).attr('data-dad-id', order);
                    }
     
                    $(this).attr('data-dad-position', order);
                    order++;
                  });
     
                  // CREATE REORDER FUNCTION
                  function updatePosition(e) {
                    var order = 1;
                    e.find(jQclass).each(function () {
                      $(this).attr('data-dad-position', order);
                      order++;
                    });
                  }
     
                  // END EVENT
                  function dadEnd() {
                    if (mouse.target != false &&  mouse.clone != false) {
                      if (callback != false) {
                        callback(mouse.target);
                      }
     
                      var appear = mouse.target;
                      var desappear = mouse.clone;
                      var holder = mouse.placeholder;
                      var bLeft = 0;
                      var bTop = 0;
     
                      // Maybe we will use this in the future
                      //Math.floor(parseFloat($daddy.css('border-left-width')));
                      //Math.floor(parseFloat($daddy.css('border-top-width')));
                      if ($.contains($daddy[0], mouse.target[0])) {
                        mouse.clone.animate({
                          top: mouse.target.offset().top - $daddy.offset().top - bTop,
                          left: mouse.target.offset().left - $daddy.offset().left - bLeft,
                        }, 300, function () {
                          appear.css({
                            visibility: 'visible',
                          }).removeClass('active');
                          desappear.remove();
                        });
                      } else {
                        mouse.clone.fadeOut(300, function () {
                          desappear.remove();
                        });
                      }
     
                      holder.remove();
                      mouse.clone = false;
                      mouse.placeholder = false;
                      mouse.target = false;
                      updatePosition($daddy);
                    }
     
                    $('html, body').removeClass('dad-noSelect');
                  }
     
                  // UPDATE EVENT
                  function dadUpdate(obj) {
                    if (mouse.target !== false && mouse.clone !== false) {
                      var $origin = $('<span style="display:none"></span>');
                      var $newplace = $('<span style="display:none"></span>');
     
                      if (obj.prevAll().hasClass('active')) {
                        obj.after($newplace);
                      } else {
                        obj.before($newplace);
                      }
     
                      mouse.target.before($origin);
                      $newplace.before(mouse.target);
     
                      // UPDATE PLACEHOLDER
                      mouse.placeholder.css({
                        top: mouse.target.offset().top - $daddy.offset().top,
                        left: mouse.target.offset().left - $daddy.offset().left,
                         mouse.target.outerWidth() - 10,
                        height: mouse.target.outerHeight() - 10,
                      });
     
                      $origin.remove();
                      $newplace.remove();
                    }
                  }
     
                  // GRABBING EVENT
                  var jq = (options.draggable !== false) ? options.draggable : jQclass;
                  $daddy.find(jq).addClass(dragClass);
                  $daddy.on('mousedown touchstart', jq, function (e) {
                    var isDelete = $(e.target).hasClass('js-delete');
                    if(isDelete) {
                      return;
                    }
                    // For touchstart we must update "mouse" position
                    if (e.type == 'touchstart') {
                      mouse.updatePosition(e.originalEvent.touches[0]);
                    }
     
                    if (mouse.target == false && active == true && (e.which == 1 || e.type == 'touchstart')) {
                      var $self = $(this);
     
                      // GET TARGET
                      if (options.draggable !== false) {
                        mouse.target = $daddy.find(jQclass).has(this);
                      } else {
                        mouse.target = $self;
                      }
     
                      // ADD CLONE
                      mouse.clone = mouse.target.clone();
                      mouse.target.css({ visibility: 'hidden' }).addClass('active');
                      mouse.clone.addClass(cloneClass);
                      $daddy.append(mouse.clone);
     
                      // ADD PLACEHOLDER
                      var $placeholder = $('<div></div>');
                      mouse.placeholder = $placeholder;
                      mouse.placeholder.addClass(holderClass);
                      mouse.placeholder.css({
                        top: mouse.target.offset().top - $daddy.offset().top,
                        left: mouse.target.offset().left - $daddy.offset().left,
                         mouse.target.outerWidth() - 10,
                        height: mouse.target.outerHeight() - 10,
                        lineHeight: mouse.target.height() - 18 + 'px',
                        textAlign: 'center',
                      }).text(placeholder);
     
                      $daddy.append(mouse.placeholder);
     
                      // GET OFFSET FOR CLONE
                      var bLeft = Math.floor(parseFloat($daddy.css('border-left-width')));
                      var bTop = Math.floor(parseFloat($daddy.css('border-top-width')));
                      var difx = mouse.x - mouse.target.offset().left + $daddy.offset().left + bLeft;
                      var dify = mouse.y - mouse.target.offset().top + $daddy.offset().top + bTop;
                      mouse.cloneoffset.x = difx;
                      mouse.cloneoffset.y = dify;
     
                      // REMOVE THE CHILDREN DAD CLASS AND SET THE POSITION ON SCREEN
                      mouse.clone.removeClass(childrenClass).css({
                        position: 'absolute',
                        top: mouse.y - mouse.cloneoffset.y,
                        left: mouse.x - mouse.cloneoffset.x,
                      });
     
                      // UNABLE THE TEXT SELECTION AND SET THE GRAB CURSOR
                      $('html,body').addClass('dad-noSelect');
                    }
                  });
     
                  $daddy.on('mouseenter touchenter', jQclass, function () {
                    dadUpdate($(this));
                  });
                });
     
                return this;
              };
            })(jQuery);    
        </script> 
        <script type="text/javascript">  
            $(function () {
              var myAction = {};
    
              var dom = {
                dad: $('#daddy'),
                delete: $('.js-delete')
              }
    
              $.extend(myAction, {
                initDad: function () {
                  dom.dad.dad();
                },
                initEvent: function () {
                  dom.delete.on('click', function () {
                    var that = $(this);
                    that.parent().remove();
                  });              
                }
              });
    
              var init = function () {
                myAction.initDad();
                myAction.initEvent();
              }();
            });    
        </script>  
    </body>            
    </html>

     不带删除功能:

    <!DOCTYPE html>            
    <html>            
    <head>            
        <meta charset="UTF-8">            
        <title>拖拽插件jquery.dad.js</title>         
        <style type="text/css">
            .dad-noSelect,.dad-noSelect *{
                -webkit-touch-callout: none;
                -webkit-user-select: none;
                -khtml-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
                cursor: -webkit-grabbing !important;
                cursor: -moz-grabbing !important;
            }
    
            .dad-container{
                position: relative;
                -webkit-touch-callout: none;
                -webkit-user-select: none;
                -khtml-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
            }
            .dad-container::after{
                content: '';
                clear: both !important;
                display: block;
            }
            .dad-active .dad-draggable-area{
                cursor: -webkit-grab;
                cursor: -moz-grab;
            }
            .dad-draggable-area>*,.dad-draggable-area img{
                pointer-events: none;
            }
            .dads-children.active{
                pointer-events: none;
            }
            .dads-children-clone{
                opacity: 1;
                z-index: 9999;
                pointer-events: none;
            }
            .dads-children-placeholder{
                pointer-events: none;
                overflow: hidden;
                position: absolute !important;
                box-sizing: border-box;
                border:4px dashed #639BF6;
                margin:5px;
                text-align: center;
                color: #639BF6;
                font-weight: bold;
            }    
            .daddy>div {
                box-sizing: border-box;
                 20%;
                padding: 5px;
                float: left;
                display: block;
                position: relative;
            }
            .daddy>div>div {
                display: block;
                height: 120px;
                line-height: 120px;
                text-align: center;
                font-size: 30px;
                font-weight: bold;
                background: #639BF6;
                color: white;
                font-family: "Arial", sans-serif;
            }
        </style>
    </head>            
    <body>    
    ccs文件和js文件可以去GitHub上下载,下载地址是:https://github.com/williammustaffa/jquery.dad.js
    本实例是直接把源代码都复制过来了
        <div id="daddy" class="dad daddy">
            <div>
                <div>1</div>
            </div>
            <div>
                <div>2</div>
            </div>
            <div>
                <div>3</div>
            </div>
            <div>
                <div>4</div>
            </div>
            <div>
                <div>5</div>
            </div>
        </div>
        <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>  
        <!-- <script src='jquery.dad.js'></script>    -->
        <script type="text/javascript">
            /*!
             * jquery.dad.js v1 (http://konsolestudio.com/dad)
             * Author William Lima
             */
    
            (function ($) {
              'use strict';
              var supportsTouch = 'ontouchstart' in window || navigator.msMaxTouchPoints;
    
              $.fn.dad = function (opts) {
                var _this = this;
    
                var defaults = {
                  target: '>div',
                  draggable: false,
                  placeholder: '',
                  callback: false,
                  containerClass: 'dad-container',
                  childrenClass: 'dads-children',
                  cloneClass: 'dads-children-clone',
                  active: true,
                };
    
                var options = $.extend({}, defaults, opts);
    
                $(this).each(function () {
                  var active = options.active;
                  var $daddy = $(this);
                  var childrenClass = options.childrenClass;
                  var cloneClass = options.cloneClass;
                  var jQclass = '.' + childrenClass;
                  var $target = $daddy.find(options.target);
                  var placeholder = options.placeholder;
                  var callback = options.callback;
                  var dragClass = 'dad-draggable-area';
                  var holderClass = 'dads-children-placeholder';
    
                  // HANDLE MOUSE
                  var mouse = {
                    x: 0,
                    y: 0,
                    target: false,
                    clone: false,
                    placeholder: false,
                    cloneoffset: {
                      x: 0,
                      y: 0,
                    },
                    updatePosition: function (e) {
                      this.x = e.pageX;
                      this.y = e.pageY;
                    },
    
                    move: function (e) {
                      this.updatePosition(e);
                      if (this.clone !== false && _this.target !== false) {
                        this.clone.css({
                          left: this.x - this.cloneoffset.x,
                          top: this.y - this.cloneoffset.y,
                        });
                      }
                    },
                  };
    
                  $(window).on('mousemove touchmove', function (e) {
                    var ev = e;
    
                    if (mouse.clone !== false && mouse.target !== false) e.preventDefault();
    
                    if (supportsTouch && e.type == 'touchmove') {
                      ev = e.originalEvent.touches[0];
                      var mouseTarget = document.elementFromPoint(ev.clientX, ev.clientY);
    
                      $(mouseTarget).trigger('touchenter');
                    }
    
                    mouse.move(ev);
                  });
    
                  $daddy.addClass(options.containerClass);
    
                  if (!$daddy.hasClass('dad-active') && active === true) {
                    $daddy.addClass('dad-active');
                  };
    
                  _this.addDropzone = function (selector, func) {
                    $(selector).on('mouseenter touchenter', function () {
                      if (mouse.target !== false) {
                        mouse.placeholder.css({ display: 'none' });
                        mouse.target.css({ display: 'none' });
                        $(this).addClass('active');
                      }
                    }).on('mouseup touchend', function () {
                      if (mouse.target != false) {
                        mouse.placeholder.css({ display: 'block' });
                        mouse.target.css({ display: 'block' });
                        func(mouse.target);
                        dadEnd();
                      };
    
                      $(this).removeClass('active');
                    }).on('mouseleave touchleave', function () {
                      if (mouse.target !== false) {
                        mouse.placeholder.css({ display: 'block' });
                        mouse.target.css({ display: 'block' });
                      }
    
                      $(this).removeClass('active');
                    });
                  };
    
                  // GET POSITION FUNCTION
                  _this.getPosition = function () {
                    var positionArray = [];
                    $(this).find(jQclass).each(function () {
                      positionArray[$(this).attr('data-dad-id')] = parseInt($(this).attr('data-dad-position'));
                    });
    
                    return positionArray;
                  };
    
                  _this.activate = function () {
                    active = true;
                    if (!$daddy.hasClass('dad-active')) {
                      $daddy.addClass('dad-active');
                    }
    
                    return _this;
                  };
    
                  // DEACTIVATE FUNCTION
                  _this.deactivate = function () {
                    active = false;
                    $daddy.removeClass('dad-active');
                    return _this;
                  };
    
                  // DEFAULT DROPPING
                  $daddy.on('DOMNodeInserted', function (e) {
                    var $thisTarget = $(e.target);
                    if (!$thisTarget.hasClass(childrenClass) && !$thisTarget.hasClass(holderClass)) {
                      $thisTarget.addClass(childrenClass);
                    }
                  });
    
                  $(document).on('mouseup touchend', function () {
                    dadEnd();
                  });
    
                  // ORDER ELEMENTS
                  var order = 1;
                  $target.addClass(childrenClass).each(function () {
                    if ($(this).data('dad-id') == undefined) {
                      $(this).attr('data-dad-id', order);
                    }
    
                    $(this).attr('data-dad-position', order);
                    order++;
                  });
    
                  // CREATE REORDER FUNCTION
                  function updatePosition(e) {
                    var order = 1;
                    e.find(jQclass).each(function () {
                      $(this).attr('data-dad-position', order);
                      order++;
                    });
                  }
    
                  // END EVENT
                  function dadEnd() {
                    if (mouse.target != false &&  mouse.clone != false) {
                      if (callback != false) {
                        callback(mouse.target);
                      }
    
                      var appear = mouse.target;
                      var desappear = mouse.clone;
                      var holder = mouse.placeholder;
                      var bLeft = 0;
                      var bTop = 0;
    
                      // Maybe we will use this in the future
                      //Math.floor(parseFloat($daddy.css('border-left-width')));
                      //Math.floor(parseFloat($daddy.css('border-top-width')));
                      if ($.contains($daddy[0], mouse.target[0])) {
                        mouse.clone.animate({
                          top: mouse.target.offset().top - $daddy.offset().top - bTop,
                          left: mouse.target.offset().left - $daddy.offset().left - bLeft,
                        }, 300, function () {
                          appear.css({
                            visibility: 'visible',
                          }).removeClass('active');
                          desappear.remove();
                        });
                      } else {
                        mouse.clone.fadeOut(300, function () {
                          desappear.remove();
                        });
                      }
    
                      holder.remove();
                      mouse.clone = false;
                      mouse.placeholder = false;
                      mouse.target = false;
                      updatePosition($daddy);
                    }
    
                    $('html, body').removeClass('dad-noSelect');
                  }
    
                  // UPDATE EVENT
                  function dadUpdate(obj) {
                    if (mouse.target !== false && mouse.clone !== false) {
                      var $origin = $('<span style="display:none"></span>');
                      var $newplace = $('<span style="display:none"></span>');
    
                      if (obj.prevAll().hasClass('active')) {
                        obj.after($newplace);
                      } else {
                        obj.before($newplace);
                      }
    
                      mouse.target.before($origin);
                      $newplace.before(mouse.target);
    
                      // UPDATE PLACEHOLDER
                      mouse.placeholder.css({
                        top: mouse.target.offset().top - $daddy.offset().top,
                        left: mouse.target.offset().left - $daddy.offset().left,
                         mouse.target.outerWidth() - 10,
                        height: mouse.target.outerHeight() - 10,
                      });
    
                      $origin.remove();
                      $newplace.remove();
                    }
                  }
    
                  // GRABBING EVENT
                  var jq = (options.draggable !== false) ? options.draggable : jQclass;
                  $daddy.find(jq).addClass(dragClass);
                  $daddy.on('mousedown touchstart', jq, function (e) {
                    // For touchstart we must update "mouse" position
                    if (e.type == 'touchstart') {
                      mouse.updatePosition(e.originalEvent.touches[0]);
                    }
    
                    if (mouse.target == false && active == true && (e.which == 1 || e.type == 'touchstart')) {
                      var $self = $(this);
    
                      // GET TARGET
                      if (options.draggable !== false) {
                        mouse.target = $daddy.find(jQclass).has(this);
                      } else {
                        mouse.target = $self;
                      }
    
                      // ADD CLONE
                      mouse.clone = mouse.target.clone();
                      mouse.target.css({ visibility: 'hidden' }).addClass('active');
                      mouse.clone.addClass(cloneClass);
                      $daddy.append(mouse.clone);
    
                      // ADD PLACEHOLDER
                      var $placeholder = $('<div></div>');
                      mouse.placeholder = $placeholder;
                      mouse.placeholder.addClass(holderClass);
                      mouse.placeholder.css({
                        top: mouse.target.offset().top - $daddy.offset().top,
                        left: mouse.target.offset().left - $daddy.offset().left,
                         mouse.target.outerWidth() - 10,
                        height: mouse.target.outerHeight() - 10,
                        lineHeight: mouse.target.height() - 18 + 'px',
                        textAlign: 'center',
                      }).text(placeholder);
    
                      $daddy.append(mouse.placeholder);
    
                      // GET OFFSET FOR CLONE
                      var bLeft = Math.floor(parseFloat($daddy.css('border-left-width')));
                      var bTop = Math.floor(parseFloat($daddy.css('border-top-width')));
                      var difx = mouse.x - mouse.target.offset().left + $daddy.offset().left + bLeft;
                      var dify = mouse.y - mouse.target.offset().top + $daddy.offset().top + bTop;
                      mouse.cloneoffset.x = difx;
                      mouse.cloneoffset.y = dify;
    
                      // REMOVE THE CHILDREN DAD CLASS AND SET THE POSITION ON SCREEN
                      mouse.clone.removeClass(childrenClass).css({
                        position: 'absolute',
                        top: mouse.y - mouse.cloneoffset.y,
                        left: mouse.x - mouse.cloneoffset.x,
                      });
    
                      // UNABLE THE TEXT SELECTION AND SET THE GRAB CURSOR
                      $('html,body').addClass('dad-noSelect');
                    }
                  });
    
                  $daddy.on('mouseenter touchenter', jQclass, function () {
                    dadUpdate($(this));
                  });
                });
    
                return this;
              };
            })(jQuery);    
        </script> 
        <script type="text/javascript">  
            $(function () {
              //dad simple demo
              $('.dad').dad();
            });    
        </script>  
    </body>            
    </html>

    备注:欢迎加入web前端求职招聘qq群:668352707

  • 相关阅读:
    大前端工具集
    Python黑魔法,一行实现并行化
    MRPT
    ./configure 交叉编译库时所最常用到的配置
    Ubuntu16.04 ARM 编译 编译器版本和unordered_map map问题
    ubuntu 16.04 ARM glog移植
    Ubuntu16.04 ARM平台移植libcurl curl-7.63.0
    ubuntu16.04 ARM平台移植xmlrpc-c1.39.12
    ubunt 14.04 Could not find CMAKE_ROOT !!! CMake has most likely not been installed correctly. Modul
    ubuntu PCL的使用
  • 原文地址:https://www.cnblogs.com/xutongbao/p/9924881.html
Copyright © 2020-2023  润新知