View Full Version : jQuery Cycle navigation links instead of play in Simple Controls gallery

06-02-2009, 08:44 PM
Hello this if my first time posting and hoping that I could get some help from the members here. I am trying to customize the navigation on The Simple Controls Gallery (http://www.dynamicdrive.com/dynamicindex4/simplegallery_suppliment.htm)
so that instead of the play buttons being displayed the anchor links are the ones that are being cycled through. Moreover I am trying to make this gallery look like this page. (http://www.officedepot.com/) I tried to target the anchor links on this page (http://capnhud.googlepages.com/simple_galleryt.html) by using this code

* Simple Controls Gallery- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more

var mygallery=new simpleGallery({
wrapperid: "simplegallery", //ID of main gallery container,
dimensions: [580, 350], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
imagearray: [
["1174279_34569752sm.jpg", "", "_new", "Do you like this car."],
["1174281_28343967sm.jpg", "", "", "Sure you do but I bet you want to know what it is?"],
["1174282_91462196sm.jpg", "", "", "I would like to know also"],
["1174283_80391871sm.jpg", "", "", "How about we try this again"]
autoplay: [true, 2500, 0], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
oninit:function(){ //event that fires when gallery has initialized/ ready to run
//Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
onslide:function(curslide, i){ //event that fires after each slide is shown

//Keyword "this": references current gallery instance
//curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
//i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)

but immediately received an error indicating that an element had not been called correctly. How do I call those anchor links correctly.

Edit I place the javascript call on the links themselves which provided me with the functionality of pressing each one to make the gallery advance forward or backwards, but how would I make it so that as the images rotate the anchor links hightlight giving an indication of what the current image link is?