asked on

How do I add arrows to simple-scrollbar-gallery wordpress plugin?

Hi- I've been working on a wordpress website that uses the simple scrollbar gallery plugin:
http://wordpress.org/extend/plugins/simple-scrollbar-gallery/

In the FAQ it says you can use css to add arrows to the scrolling thumbnails but I can't figure out how. If I add the images into the div, it stops the thumbs from scrolling altogether. I'm not sure how to use the background-image css property in this case because I want 2 images, one on the left & one on the right.

Here's an example of the gallery in use:
http://www.creativemusicphotography.com/wordpress/?p=1302

thanks!

Dean OBrien

Not sure if this would work, but this is what i would do for starters....

Open the file simple-scroll-gallery.php, and edit this line:

$output .= " <div class='gallery-list'>\n";

As you can see this is the innermost div that contains the thumbnail gallery. Now to begin try adding a small red square div above the thumbs, using z-index:100. If this div does not alter the function of the scroll bar, then you should be fine to simply pop two arrows in 'above the current thumbs.

So try adding this:

$output .= " <div class='gallery-list'><div style='position:absolute;z-index:100;left:0px;top:0px;width:100px;height:100px;background:#f00;'>text</div>\n";

Let me know if

a) you see red box
b) it alters the function of the scroll bar

Easynow

xanabobana

ASKER

unfortunately, that made all of the thumbs display at once & moved the entire thumbnail div to the top of the page. I left it so you could see http://www.creativemusicphotography.com/wordpress/?p=1302

ASKER CERTIFIED SOLUTION

Dean OBrien

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

xanabobana

ASKER

perfect! thanks!