cycle2 icon indicating copy to clipboard operation
cycle2 copied to clipboard

Multiple Progress Bars for multiple cycles on one page

Open syberknight opened this issue 7 years ago • 2 comments

i know HTML/CSS but my JS/Jquery skills are pretty lacking (for now). i've been researching & busting my brain but can't seem to figure out how to get the "Progress" bar option to work for multiple dynamic slideshows per page.

it's probably compounded by the fact that i'm trying to use CYCLE2 with Tumblr-Kit + JS-Render scripts.

situation is, i'm trying to get a Tumblr blog embedded in to a webpage. TumblrKit is the only way i've found that i've been able to get to work with the Tumblr API AND the only solution that deals with "Photoset" posts nicely.

The TumblrKit code utilized the older version of Cycle. once i looked at what the newer version had to offer, i couldn't help myself but to upgrade it all.

i've been able to successfully get it all to work fine with the woeful exception of the Progress bar addon. when i copy/paste the Progress code in to the page with a STATIC list of slideshow images, it works wonderfully.

but 1) when i put more than one Cycle on the same page, i haven't been able to figure out how to tell the Progress script to work for each instance (but it will work on the 1st instance on the page); and 2) when i put the Progress target div "inside" the TumblrKit+JSRender script (which needs to happen ultimately, it seems), it just doesn't do anything.

so, i think i'm needing to figure out BOTH of these issues.

FYI:

  • my working test page is @ http://sanctuaryinternational.com/test-tumblrkit
  • view page source & begin @ line 130
  • the problem section is between lines 462-532
  • i've inserted a bunch of "comments" with relevant info
  • the Cycle2 Progress option @ http://jquery.malsup.com/cycle2/demo/progress.php
  • the TumblrKit + JSRender @ https://github.com/matthewbuchanan/tumblr-kit

my thanks to any info, hints, direction, code, etc given, -jason.

syberknight avatar Oct 20 '16 06:10 syberknight