作者 anyv
1 个管道 的构建 通过 耗费 1 秒

4

  1 +// 删除默认
  2 +document.addEventListener('DOMContentLoaded', function() {
  3 + // var oUl = document.getElementsById('ad_contentUl')[0];
  4 + var oUl = document.querySelector('#ad_contentUl');
  5 + var aLi = oUl.querySelectorAll('li');
  6 + var aDiv = document.querySelectorAll('.ad_conBox');
  7 + var aDel = document.querySelectorAll('.ad_move');
  8 + var aMo = document.querySelectorAll('.ad_mo');
  9 + var imgs = document.querySelectorAll('.select_img img');
  10 + var host = '/themes/simpleboot3/public/assets/';
  11 + var n = 0;
  12 + for (var i = 0; i < aLi.length; i++) {
  13 + console.log(i);
  14 + aLi[i].index = i;
  15 + // 滑动开始
  16 + aLi[i].addEventListener('touchstart', function(ev) {
  17 + ev.preventDefault();
  18 + var oldX = ev.targetTouches[0].pageX;
  19 + console.log(oldX);
  20 +
  21 + function fnMove(ev) {
  22 + ev.preventDefault();
  23 + var newX = ev.targetTouches[0].pageX - oldX;
  24 + aLi[this.index].style.transform = 'translateX(' + newX + 'px)';
  25 + }
  26 +
  27 + function fnEnd(ev) {
  28 + aLi[this.index].removeEventListener('touchmove', fnMove, false);
  29 + aLi[this.index].removeEventListener('touchend', fnEnd, false);
  30 + ev.preventDefault();
  31 + var changeX = ev.changedTouches[0].pageX;
  32 + if (oldX - changeX > 40) {
  33 + aLi[this.index].style.transition = '1s all ease';
  34 + aLi[this.index].style.transform = 'translateX(-2.58rem)';
  35 + } else {
  36 + aLi[this.index].style.transform = 'translateX(0)';
  37 + }
  38 + }
  39 + aLi[this.index].addEventListener('touchmove', fnMove, false);
  40 + aLi[this.index].addEventListener('touchend', fnEnd, false);
  41 + }, false)
  42 + // 删除按钮
  43 + aDel[i].index = i;
  44 + aDel[i].addEventListener('touchstart', function() {
  45 + this.innerHTML = '';
  46 + this.style.height = '0';
  47 + this.style.display = 'none';
  48 + aLi[this.index].style.height = '0';
  49 + aLi[this.index].style.display = 'none';
  50 + aDiv[this.index].style.height = '0';
  51 + aDiv[this.index].style.display = 'none';
  52 + aDiv[this.index].innerHTML = '';
  53 + this.addEventListener('transitionend', function() {
  54 + oUl.removeChild(aLi[this.index]);
  55 + }, false)
  56 + }, false);
  57 + aMo[i].index = i;
  58 + aMo[i].addEventListener('touchstart', function() {
  59 + // var adName = document.querySelectorAll('.ad_conMo');
  60 + $('.ad_conMo').eq(this.index).css('display', 'block').parents('li').siblings().find('.ad_conMo').css('display', 'none')
  61 +
  62 + }, false);
  63 + imgs[i].index =i;
  64 + imgs[i].addEventListener('touchstart',function(){
  65 + if($(this).attr('src') == host+'images/39_0.png'){
  66 + $(this).attr('src',host+'images/73.png').parents('li').siblings().find('.select_img img').attr('src',host+'images/39_0.png');
  67 + }else{
  68 + $(this).attr('src',host+'images/39_0.png')
  69 +
  70 + }
  71 + })
  72 + }
  73 +}, false);