modify image carousel to allow iphone ipad swip

lquid

New Member
I have a image carousel that works when the user clicks the prev or next arrow. Is it poss. to add a option for when a person is on a ipad, iphone... to just swipe through the images? attached is a what I've created for my image carousel.\[code\] var galleryImages = jQuery("#gallery > li"), totalImages = galleryImages.length, imageWidth = jQuery("#gallery > li:first").outerWidth(true), totalWidth = imageWidth * totalImages, totalWidth = totalWidth + 4, visibleImages = Math.round(jQuery("#gallery-wrap").width() / imageWidth), visibleWidth = visibleImages * imageWidth, stopPosition = (visibleWidth - totalWidth), imageIndex = 0, setGalleryLinks = function () { var style = "showing-in-gallery"; galleryImages.each(function (i, e) { var link = $("a.ex1:eq(" + i + ")"); link.removeClass(style); if (i == imageIndex || i == imageIndex + 1) { i = imageIndex; jQuery("a.ex1:eq(" + i + ")").addClass("showing-in-gallery"); $("a.ex2").addClass('showing-in-gallery'); } else { $(e).removeClass("showing-in-gallery"); } }); }; jQuery("#gallery").width(totalWidth); jQuery("#gallery-prev").click(function () { var left = jQuery("#gallery").position().left; if (left < 0 && !jQuery("#gallery").is(":animated")) { jQuery("#gallery").animate({ left: "+=" + imageWidth + "px" }, 400); imageIndex -= 1; setGalleryLinks(); } return false; }); jQuery("#gallery-next").click(function () { var left = jQuery("#gallery").position().left; if (left > stopPosition+1 && !jQuery("#gallery").is(":animated")) { jQuery("#gallery").animate({ left: "-=" + imageWidth + "px" }, 400); imageIndex += 1; setGalleryLinks(); } return false; }); setGalleryLinks(); }});\[/code\]
 
Back
Top