Ok, here is what i would do: 1/ develop for people that do not have javascript enabled. So instead of using anchors pointing to an image, use variables in your urls.
http://manhattanwest.com/media-center/video-images.php#link13 Becomes http://manhattanwest.com/media-center/video-images.php?link=13 (for example) 2/ server-side (php script): The way i do it is this: via javascript, i append a variable js=1. So if no javascript is enabled, the url stays the same, but if javascript is available on the client, the url becomes http://manhattanwest.com/media-center/video-images.php?link=13&js=1 So, your server-side script has to accomodate for both cases <?php // helper function function outputAjax($html){ return $html; exit; } // runtime If ($_GET['link']>0){ $sql= "SELECT * FROM table WHERE image_id='{$_GET['link']}'"; // process sql query $img = '<img src="'.$my_image_path.'"/>'; // for example :) If ($_GET['js']==='1'){ outputAjax($output); exit; } else { // put the complete html page output ?> <html> <head> ... </head> <body> <?php echo $output; ?> </body> </html> <? } } else { $output = 'no image specified'; exit; } ?> 3/ now that those users without js are safe, onto javascript and jquery: Grab this plugin: http://www.mathias-bank.de/2006/10/28/jquery-plugin-geturlparam/ it will allow you to easily get the current image (this is pseudo, non tested code) $(document).ready(function(){ var images= $('#images a').attr("href"); var currentImage,totalImages, nextImage , prevImage; totalImages = 34; // have this javascript variable hardcoded in your html currentImage = ($.getURLParam("link")!='') ? $.getURLParam("link"): 0 ; // make prev next links var baseUrl = 'http://manhattanwest.com/media-center/video-images.php?link='; $('#imgPrevNextMenu a').bind('click',function(){ currentImage = ($.getURLParam("link")!='') ? $.getURLParam("link"): 0 ; prevImage=(currentImage +1>totalImages) ? 0: currentImage +1; prevUrl =(currentImage-1<0) ? totalImages : currentImage-1; $("div#imgContainer").load(Url); $('a#next').attr({href: baseUrl+images[nextImage] ); $('a#prev').attr({href: baseUrl+images[prevImage] ); }); // make the links in the 3 columns below work $("a.imgLink").bind("click",function(){ var Url = $(this).attr("href")+'js=1'; $("div#imgContainer").load(Url); }); }); I did not test this, but you should get the idea... Hope this helps, Alexandre -----Original Message----- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Bradley32 Sent: mercredi 16 mai 2007 18:40 To: jquery-en@googlegroups.com Subject: [jQuery] Next/Previous Links Hey all! Here is the URL for the issue I am referring to: http://manhattanwest.com/media-center/video-images.php Problem: I need to make the "Previous" and "Next" links function to rotate through the 4 columns of links below the image area and unfortunately I am not the best with Javascript so any help would be AWESOME!!!!! Any ideas? Thanks in advance! -- View this message in context: http://www.nabble.com/Next-Previous-Links-tf3766061s15494.html#a10646671 Sent from the JQuery mailing list archive at Nabble.com. Ce message Envoi est certifié sans virus connu. Analyse effectuée par AVG. Version: 7.5.467 / Base de données virus: 269.7.1/805 - Date: 15/05/2007 10:47
