【实用随记】data属性的应用

这个函数是云移动的函数，因为后期修改需求，需要用到一个固定的参数，

但是我又不想修改函数，就在这里指定了一个data属性，而后调用，就不用多加一个参数了。

 var stopFlag = false;

  $('#cloud-big'). data('left','-359px');
  $('#cloud-middle'). data('left','-711px');
  $('#cloud-small2'). data('left','-304px');
  $('#cloud-small1'). data('left','12px');
  $('#ballloon-big'). data('top','50px');
  $('#ballloon-point'). data('top','115px');
  var move = function (px, time, ele) {
      if(ele.data('stop')){
          return
      }
    var w1 = ele.width();
    ele.animate({left: '-=' + px}, {
      duration: time,
      easing: 'linear',
      progress: function () {
        var r = parseInt(ele.css('left').replace('px', ''));
        var m = parseInt(ele.css('margin-left').replace('px', ''));
        if (ele.data('stop') || w1 + r + m <= 0) {
          ele.stop();
        }
      },
      always: function () {
          if(ele.data('stop')){
              ele.animate({ 'margin-left':ele.data('left'),'top':ele.data('top'),left: '50%'}, {
                  duration: 300,
                  easing: 'easeOutCubic',
              });
              return;
          }
        var w2 = $('#front-animation').width();
        ele.css({
            'left': w2 + 'px',
            'margin-left':'0'});
        move(px, time, ele);
      },
      complete: function () {
        if(stopFlag){
            return
        }
        var w2 = $('#front-animation').width();
        ele.css('left', w2 + 'px');
        move(px, time, ele);
      }
    });
  }