Adding hyperlinks to a javascript image array

Question

I'm having a problem with a java carousel. The code is working fine on my page, but I want to add hyperlinks to the images, but I'm unsure how to achieve this. I've tried a few things, but its just caused the code to stop working, and the carousel to drop off the page.

As I say, its all working fine, but as soon as I alter the default code, it falters.

The code I have so far is:

<script type="text/javascript">

var firstbgcarousel=new bgCarousel({
    wrapperid: 'mybgcarousel', //ID of blank DIV on page to house carousel 
    imagearray: [
        ['autumnpark.jpg', '<h2>Autumn Day</h2>The sun peaks through the trees, a knife that cuts through the chill, crisp air.'], //["image_path", "optional description"]
        ['chime.jpg', '<h2>Wind Chime</h2>The bellweather of the sky, the chime speaks of impending turmoil.'],
        ['girlportrait.jpg', 'The scent of spring invigorates her as she inhales whilst the warm breeze brings a wave of tranquility.'],
        ['redbench.jpg', 'Alone and Lonliness- Peace and Inner Struggle'] //<--no trailing comma after very last image element!
    ],
    displaymode: {type:'auto', pause:3000, cycles:2, stoponclick:false, pauseonmouseover:true},
    navbuttons: ['left.gif', 'right.gif', 'up.gif', 'down.gif'], // path to nav images
    activeslideclass: 'selectedslide', // CSS class that gets added to currently shown DIV slide
    orientation: 'h', //Valid values: "h" or "v"
    persist: true, //remember last viewed slide and recall within same session?
    slideduration: 500 //transition duration (milliseconds)
})

</script>

Any help is appreciated....

Answer 1

Check out the source here: http://home.comcast.net/~jscheuer1/side/bgcarousel/demo_linked.htm

Great example. Just add a link into the slide text, and use CSS to style it to the width and height 100% of the slide box.