The Slick carousel has the ability to autoplay. Can that autoplay be incorporated into the configuration in the scripts.js file? Can it be added to just the SFNT screen where the What's Popular carousel resides?
Announcement
Collapse
No announcement yet.
Can What's Popular carousel be set to autoplay?
Collapse
X
-
Can What's Popular carousel be set to autoplay?
Leslie Kirk
Miva Certified Developer
Miva Merchant Specialist since 1997
Previously of Webs Your Way (aka Leslie Nord leslienord)
Email me: [email protected]
www.lesliekirk.com
Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr
Tags: None
-
You could try adding this to the scripts.js file or your own custom.js file:
Code:jsSFNT: function () { // ---- Open StoreFront Slider Image Gallery ---- // cornerstoneUX.sharedFunctions.productGallery($('#js-main-image-zoom')); //change this to match the slider container var mainImageZoom = $('#js-main-image-zoom'),//change this to match the slider container thumbnails = $('#js-thumbnails');//change this to match the slider container //console.log(window['image_data' + productID][0]['image_data'][2]); thumbnails.on('click', 'div', function () { var thumbnailIndex = $(this).attr('data-index'); mainImageZoom.attr('data-index', thumbnailIndex); var clickedLI = parseFloat($(this).attr('data-index')); if ( thumbnailIndex ) { $('#js-main-dots li.active').removeClass('active'); $('#js-main-dots li[data-index="' + thumbnailIndex + '"]').addClass('active'); } }); $.getScript(theme_path + '/js/jquery.slick.min.js', function () { $('#js-thumbnails').slick({ vertical: true, draggable: false, slidesToScroll: 1, slidesToShow: 4 autoplay: true, //Add this autoplaySpeed: 2000, //set this }); });
Bruce Golub
Phosphor Media - "Your Success is our Business"
Improve Your Customer Service | Get MORE Customers | Edit CSS/Javascript/HTML Easily | Make Your Site Faster | Get Indexed by Google | Free Modules | Follow Us on Facebook
phosphormedia.com
-
I sort of see what you are trying to do here, but there's too much noise in the way for me to figure it out. The example you gave comes from the jsPROD: function which is supposed to also do the thumbnail swatch swap on the product page so there are a couple things that don't get used for the product carousel on the SFNT page. I guess I was thinking there was a simpler way to tell that carousel to autoplay sort of like in the example at Slick page
Code:$('.autoplay').slick({ slidesToShow: 3, slidesToScroll: 1, autoplay: true, autoplaySpeed: 2000, });
Leslie Kirk
Miva Certified Developer
Miva Merchant Specialist since 1997
Previously of Webs Your Way (aka Leslie Nord leslienord)
Email me: [email protected]
www.lesliekirk.com
Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr
Comment
-
Essentially, all you have to do IS add the autoplay: true and autoplayspeed:2000
Hmm, I think this is from a site where we are using the thumbnail slider on the home page so your milage my actually be different, but if you can find the script that runs the slider in question, you just need to add those two items.
Yea, forums are not a good vehicle for code sharing. We need a "code pen" like system where 1) you could paste the actual code you are having problems with, and 2) we could tweak it and test it. (with permission of course).
An interesting idea would be the ability to have sort of a "remote" template. The idea is you'd replace code with something like <mvt:item name="remote" param="templateName" />, and then the system would create a managed template where you paste the code. Now, the real tricky part is, you could provide outside access to a forum member (or some other method) and they could tweak the actual code.
Don't know if this would be possible or even how useful (especially cause in this case it was javascript...but I guess we could have run it inline until it worked...anyway, probably just the scotch talking at this point...Bruce Golub
Phosphor Media - "Your Success is our Business"
Improve Your Customer Service | Get MORE Customers | Edit CSS/Javascript/HTML Easily | Make Your Site Faster | Get Indexed by Google | Free Modules | Follow Us on Facebook
phosphormedia.com
Comment
Comment