在移动设备中，当我滑动左下一个div应该来但前一个div来了。这意味着swipeleft和swiperight不起作用。
我很累。请允许。提前谢谢。
function Swipe(t, n) {
"use strict";
function e() {
//h = All Div //w = All Div Length //m = 500 //t.offsetWidth = 500 //E.style.width = "" //h.length * m + "px" = 2000px
h = E.children, w = Array(h.length), m = t.getBoundingClientRect().width || t.offsetWidth, E.style.width = h.length * m + "px";
for (var n = h.length; n--;) {
var e = h[n]; //e = Total Particular Div
e.style.width = m + "px", e.setAttribute("data-index", n), f.transitions && (e.style.left = n * -m + "px", a(n, b > n ? -m : n > b ? m : 0, 0))
}
f.transitions || (E.style.left = b * -m + "px"), t.style.visibility = "visible"
}
function i() {
b ? r(b - 1) : n.continuous && r(h.length - 1)
}
function o() {
h.length - 1 > b ? r(b + 1) : n.continuous && r(0)
}
function r(t, e) {
//alert(t);
//alert($('.swipe-wrap').find('div').eq(t).text());
if (b != t) {
if (f.transitions) {
for (var i = Math.abs(b - t) - 1, o = Math.abs(b - t) / (b - t); i--;) a((t > b ? t : b) - i - 1, m * o, 0);
a(b, m * o, e || T), a(t, 0, e || T)
} else d(b * -m, t * -m, e || T);
b = t, v(n.callback && n.callback(b, h[b]))
}
}
function a(t, n, e) {
s(t, n, e), w[t] = n
}
function s(t, n, e) {
var i = h[t],
o = i && i.style;
o && (o.webkitTransitionDuration = o.MozTransitionDuration = o.msTransitionDuration = o.OTransitionDuration = o.transitionDuration = e + "ms", o.webkitTransform = "translate(" + -n + "px,0)" + "translateZ(0)", o.msTransform = o.MozTransform = o.OTransform = "translateX(" + -n + "px)")
}
function d(t, e, i) {
if (!i) return E.style.left = e + "px", void 0;
var o = +new Date,
r = setInterval(function() {
var a = +new Date - o;
return a > i ? (E.style.left = e + "px", y && c(), n.transitionEnd && n.transitionEnd.call(event, b, h[b]), clearInterval(r), void 0) : (E.style.left = (e - t) * (Math.floor(100 * (a / i)) / 100) + t + "px", void 0)
}, 4)
}
function c() {
p = setTimeout(o, y)
}
function u() {
y = 0, clearTimeout(p)
}
var l = function() {},
v = function(t) {
setTimeout(t || l, 0)
},
f = {
addEventListener: !!window.addEventListener,
touch: "ontouchstart" in window || window.DocumentTouch && document instanceof DocumentTouch,
transitions: function(t) {
var n = ["transformProperty", "WebkitTransform", "MozTransform", "OTransform", "msTransform"];
for (var e in n)
if (void 0 !== t.style[n[e]]) return !0;
return !1
}(document.createElement("swipe"))
};
if (t) {
var h, w, m, E = t.children[0];
n = n || {};
var p, x, b = parseInt(n.startSlide, 10) || 0,
T = n.speed || 300,
y = n.auto || 0,
L = {},
g = {},
k = {
handleEvent: function(t) {
switch (t.type) {
case "touchstart":
this.start(t);
break;
case "touchmove":
this.move(t);
break;
case "touchend":
v(this.end(t));
break;
case "webkitTransitionEnd":
case "msTransitionEnd":
case "oTransitionEnd":
case "otransitionend":
case "transitionend":
v(this.transitionEnd(t));
break;
case "resize":
v(e.call())
}
n.stopPropagation && t.stopPropagation()
},
start: function(t) {
var n = t.touches[0];
L = {
x: n.pageX,
y: n.pageY,
time: +new Date
}, x = void 0, g = {}, E.addEventListener("touchmove", this, !1), E.addEventListener("touchend", this, !1)
},
move: function(t) {
if (!(t.touches.length > 1 || t.scale && 1 !== t.scale)) {
n.disableScroll && t.preventDefault();
var e = t.touches[0];
g = {
x: e.pageX - L.x,
y: e.pageY - L.y
}, x === void 0 && (x = !!(x || Math.abs(g.x) < Math.abs(g.y))), x || (t.preventDefault(), u(), g.x = g.x / (!b && g.x > 0 || b == h.length - 1 && 0 > g.x ? Math.abs(g.x) / m + 1 : 1), s(b - 1, g.x + w[b - 1], 0), s(b, g.x + w[b], 0), s(b + 1, g.x + w[b + 1], 0))
}
},
end: function() {
var t = +new Date - L.time,
e = 250 > Number(t) && Math.abs(g.x) > 20 || Math.abs(g.x) > m / 2,
i = !b && g.x > 0 || b == h.length - 1 && 0 > g.x,
o = 0 > g.x;
x || (e && !i ? (o ? (a(b - 1, -m, 0), a(b, w[b] - m, T), a(b + 1, w[b + 1] - m, T), b += 1) : (a(b + 1, m, 0), a(b, w[b] + m, T), a(b - 1, w[b - 1] + m, T), b += -1), n.callback && n.callback(b, h[b])) : (a(b - 1, -m, T), a(b, 0, T), a(b + 1, m, T))), E.removeEventListener("touchmove", k, !1), E.removeEventListener("touchend", k, !1)
},
transitionEnd: function(t) {
parseInt(t.target.getAttribute("data-index"), 10) == b && (y && c(), n.transitionEnd && n.transitionEnd.call(t, b, h[b]))
}
};
return e(), y && c(), f.addEventListener ? (f.touch && E.addEventListener("touchstart", k, !1), f.transitions && (E.addEventListener("webkitTransitionEnd", k, !1), E.addEventListener("msTransitionEnd", k, !1), E.addEventListener("oTransitionEnd", k, !1), E.addEventListener("otransitionend", k, !1), E.addEventListener("transitionend", k, !1)), window.addEventListener("resize", k, !1)) : window.onresize = function() {
e()
}, {
setup: function() {
e()
},
slide: function(t, n) {
r(t, n)
},
prev: function() {
u(), i()
},
next: function() {
u(), o()
},
getPos: function() {
return b
},
kill: function() {
u(), E.style.width = "auto", E.style.left = 0;
for (var t = h.length; t--;) {
var n = h[t];
n.style.width = "100%", n.style.left = 0, f.transitions && s(t, 0, 0)
}
f.addEventListener ? (E.removeEventListener("touchstart", k, !1), E.removeEventListener("webkitTransitionEnd", k, !1), E.removeEventListener("msTransitionEnd", k, !1), E.removeEventListener("oTransitionEnd", k, !1), E.removeEventListener("otransitionend", k, !1), E.removeEventListener("transitionend", k, !1), window.removeEventListener("resize", k, !1)) : window.onresize = null
}
}
}
}(window.jQuery || window.Zepto) && function(t) {
t.fn.Swipe = function(n) {
return this.each(function() {
t(this).data("Swipe", new Swipe(t(this)[0], n))
})
}
}(window.jQuery || window.Zepto);html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, del, dfn, em, img, ins, kbd, q, samp, small, strong, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td, article, aside, footer, header, nav, section {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
body {
-webkit-text-size-adjust:none;
font-family:sans-serif;
min-height:416px;
}
h1 {
font-size:33px;
margin:50px 0 15px;
text-align:center;
color:#212121;
}
h2 {
font-size:14px;
font-weight:bold;
color:#3c3c3c;
margin:20px 10px 10px;
}
small {
margin:0 10px 30px;
display:block;
font-size:12px;
}
a {
margin:0 0 0 10px;
font-size:12px;
color:#3c3c3c;
}
html, body {
background: #f3f3f3;
}
#console {
font-size: 12px;
font-family:"Inconsolata", "Monaco", "Consolas", "Andale Mono", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
color: #999;
line-height: 18px;
margin-top: 20px;
max-height: 150px;
overflow: auto;
}
#mySwipe div b {
display:block;
font-weight:bold;
color:#14ADE5;
font-size:20px;
text-align:center;
margin:10px;
padding:100px 10px;
box-shadow: 0 1px #EBEBEB;
background: #fff;
border-radius: 3px;
border: 1px solid;
border-color: #E5E5E5 #D3D3D3 #B9C1C6;
}
.swipe {
overflow: hidden;
visibility: hidden;
position: relative;
}
.swipe-wrap {
overflow: hidden;
position: relative;
}
.swipe-wrap > div {
float:left;
width: 20px;
position: relative;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Swipe 2</h1>
<link rel="stylesheet" href="css/SwipeTest.css">
<div id='mySwipe' style='max-width:500px;margin:0 auto' class='swipe'>
<div class='swipe-wrap'>
</div>
</div>
<div style='text-align:center;padding-top:20px;'>
<button id="Prv">prev</button>
<button id="Nxt">next</button>
</div>
<script type="text/javascript" src='js/SwipeTest.js'></script>
<script type="text/javascript">
$(document).ready(function (e) {
$("#Prv").click(function(){
mySwipe.next();
});
$("#Nxt").click(function(){
mySwipe.prev();
});
$('.swipe-wrap').append('<div><b>A</b></div>');
$('.swipe-wrap').append('<div><b>B</b></div>');
$('.swipe-wrap').append('<div><b>C</b></div>');
$('.swipe-wrap').append('<div><b>D</b></div>');
$('.swipe-wrap').append('<div><b>De</b></div>');
$('.swipe-wrap').append('<div><b>Do</b></div>');
$('.swipe-wrap').append('<div><b>Di</b></div>');
var elem = document.getElementById('mySwipe');
window.mySwipe = Swipe(elem, {
});
});
</script>