360 image rotation
so have bit of java script use allows person cycle through series of photos create 360º rotation of product. heres code.
$(document).ready(function ($) {
var $product = $('#product'),
$imgs = $product.find(".child"),
imagetotal = $imgs.length - 1,
clicked = false,
widthstep = 20,
currpos,
currimg = 0,
lastimg = 0;
$imgs.bind('mousedown', function (e) {
e.preventdefault(); // prevent dragging images
})
.filter(':gt(0)').addclass('notseen');
$product.bind('mousedown touchstart', function (e) {
if (e.type == "touchstart") {
currpos = window.event.touches[0].pagex;
} else {
currpos = e.pagex;
}
clicked = true;
});
$(document)
.bind('mouseup touchend', function () {
clicked = false;
})
.bind('mousemove touchmove', function (e) {
if (clicked) {
var pagex;
if (e.type == "touchmove") {
pagex = window.event.targettouches[0].pagex;
} else {
pagex = e.pagex;
}
widthstep = 20;
if (math.abs(currpos - pagex) >= widthstep) {
if (currpos - pagex >= widthstep) {
currimg++;
if (currimg > imagetotal) {
currimg = 0;}
} else {
currimg--;
if (currimg < 1) {
currimg = imagetotal;
}
}
currpos = pagex;
$imgs.eq(lastimg).addclass('notseen');
$imgs.eq(currimg).removeclass('notseen');
lastimg = currimg;
// $obj.html('<img src="' + aimages[options.currimg] + '" />');
}
}
});
});
want able incorporate edge document , automate changing of classes every photo cycled through automatically. idea on how this?
More discussions in Edge Animate CC
adobe
Comments
Post a Comment