Different images in title line instead of text

6 different images that is. Thanks.

Yes, it’s possible. Couple of questions.
1. have you checked out the documentation?
2. how confortable are you with css?

Ok, and a third:
Can you share a link to the page you are working on?

Hi Baden.

1. Yup. Done a bit of tweaking already.
2. Comfortable enough so far! Fire away…
3. Can’t I’m afraid – got an “under construction” plugin on that I can’t remove just yet.

Thanks.

I’m really looking forward to your solution for this as well. Thanks!

Here is a little step-by-step of what you need to do to get image trigger elements to line up:
Step One
Create each expand element using the title element as the image tag. Assign it a trigclass=”noarrow” and give it an alt attribute that makes sense:

[expand title="<img src='https://example.com/image.jpg' />" trigclass="noarrow" alt="turtles one"]This is the content of the first image[/expand]

Step Two
Wrap each expand element in a div with a unique class. We used ‘birdwire‘ because it makes all the images nice and need in a row like… birds on a wire! Hmmm, maybe we should have used ducksrow. Anyway, each element will now look like so:

<div class="birdwire">[expand title="<img src='https://example.com/image.jpg' />" trigclass="noarrow" alt="turtles one"]This is the content of the first image[/expand]<div>

Final Step
Add the following to your theme’s style.css:

.birdwire {
        display: inline;
        float: left;
        margin-right: 1.625em;
        width: 160px;
}

And Blam-O! The images line up and float left.
Here is little woking example for you to check out: https://spacedonkey.de/623/collapse-o-matic-line-of-trigger-images/

Let us know if you get it working!

Thanks! That is really close to what I’m looking to do, but I need each trigger image to load the content in the same div below (not one div under each image). Is this possible? I’m trying to load full width slideshows with these icon triggers.

Thanks!!!

Also, can the trigger icon hide the other content (since I don’t want overlapping in the target content area)

Thanks again!

Check out ‘highlander grouping’ in the documentation

Oh right, that will definitely solve the hiding the open when clicking a new. Thanks! Any thoughts on having it show the target content in the same div?

That’s not really the way this plugin works. The only idea you might try, is to use the roll-your-own method and then group all the target divs together. Then assign the snap-shut class to all triggers.

This will snap each open element shut when it collapses, and then the new element will expand gracefully. If that makes any sense.

Best of luck!

Brilliant – thanks heaps.