AnythingSlider.js — Auto-generating new sliders in tumblr

[c_holmes]

So I have been using the Anythingslider in my tumblr theme and it is working great. I’ve run into one issue though and I can’t seem to solve it.

Basically, I am turning multi-photo posts (photo sets) into lists, and the lists into paginated sliders using the anything slider. The issue I am running into is that it seems the anythingslider won’t accept a new slider that uses an existing ID tag.

So my thoughts to resolve this were to somehow get the anything slider to accept multiple instances of the same ID, or to generate a new slider ID for each photo set list and set up these new sliders using same settings to create a paginated slider.

you can view the implementation here it shows the issue.

Any help you all might be able to give me would be greatly appreciated.

— Chad

[Mottie]

Hi Chad!

I’m not quite sure I understand what you are trying to do. So instead of replacing the contents of the slider, you want to replace the whole slider? *stratches head*

[c_holmes]

hmmm… Let me try and break it down with some code.

tumblr works a lot like wordpress, but does a bunch of the PHP work for you. So, for example:

{block:posts}

{block:photoSet}



{block:photos} 
{/block:photos}



{/block:photoSet}

{/block:posts}

this would return every “photo set” post. In each post the photos would be formatted into an unordered list with an ID of slider (what I want to use to get the anything slider going).

The problem is, I might have 3 different photo sets with unordered lists with an ID of Slider. the first, or most recent one, will work, but the other two with the same ID of “slider” do not (they render like a bulleted list of images).

I want to know if their is away to get the anythingSlider to recognize multiple sliders with the same ID. Or is there someway to generate unique slider IDs for these unordered lists when tumblr loops through the posts.

I know that there is a wordpress implementation of the anythingslider. How does that work with loops? i.e. if I had wordpress print 7 posts, and 4 of them had a slider on them, how does the anythingslider recognize those sliders / prevent duplicate IDs.

I hope that’s a little bit clearer.

[Mottie]

Hmm, well IDs must be unique, so I think your best bet would be to just assign a class name to the sliders, then initialize the plugin on the class instead of the ID. Like this:

{block:posts}

{block:photoSet}



{block:photos} 
{/block:photos}



{/block:photoSet}

{/block:posts}

Then when initializing the plugin, use

$('ul.slider').anythingSlider();

Now you can have as many sliders as you want on the page.

[c_holmes]

BOOM GOES THE DYNAMITE! You’ve got it.

Can I buy you a coffee? Tea?

you let me know.

[Author]

Posts