Results 1 to 2 of 2

Thread: Background Image Carousel - linking images

  1. #1
    Join Date
    Feb 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Background Image Carousel - linking images

    hello,
    I am using the Background Image Carousel spript.

    everything works just fine (i havent touched the .js file at all), but i was wondering out if some one knows how to link the images out. I am able to make the caption a link, but not the whole picture.

    What changes do i need to make so i am able to make the images link to another page.

    Thanks!

  2. #2
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Warning: Please include a link to the DD script in question in your post, in this case, http://dynamicdrive.com/dynamicindex14/bgcarousel.htm. See this thread for the proper posting format when asking a question.

    Try the below modified .js file, which lets you associate a link to particular slides, so clicking on the slide goes to that link. It extends the initialization code with a "linkarray" option:

    Code:
    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!
    	],
    	linkarray: [
    		'http://cnn.com',
    		'',
    		'http://yahoo.com'
    	],
    	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)
    })
    Here the 1st and 3rd slides have a link associated with it.
    DD Admin

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •