how to make previous and next buttons

Hi,
I am making a site in which I want to show a photo gallery. (which is all made manually means I did not use any slideshow (flash , xml) codes. But now I am facing a problem its When I click to the thumbnails I redirect to the bigger image of that particular image But I don't know how to make the buttons for next images and previous images (I mean working or code)
Any help would be highly appreciated.
Regards

 

Hey if you have some time to spent on this then you can do one thing that just make a separate page for each image and post next and previous link on each page. Previous link will redirect to previous page and next link will redirect to next page

 

Why not use something like this? http://www.leigeber.com/2008/12/javascript-slideshow/

 

thanks a lot friends .. It seems the script (you have mentioned) will solve my problem , by linking each and every page will take some time so let me try the script. anyways thanks for your help

 

index = 0;
quotes = [PUT YOUR QUOTES IN HERE];
quotesLength = quotes.length;
quoteDiv = document.getElementById("quotebox");
fun getFirst()
{
quoteDiv = document.getElementById("quotebox");
quoteDiv.innerHTML = "<p>" + quotes[index] + "</p>";
document.getElementById("prev").disab… = "disabled";
}
fun getNext()
{
quoteDiv = document.getElementById("quotebox");
nextButton = document.getElementById("next");
document.getElementById("prev").disab… = "";
index += 1;
if(index + 1 == quotesLength)
{
nextButton.disabled = "disabled";
}
else
{
nextButton.disabled = "";
}
quote = quotes[index];
quoteDiv.innerHTML = "<p>" + quote + "</p>";
}
fun getPrevious()
{
quoteDiv = document.getElementById("quotebox");
prevButton = document.getElementById("prev");
index -= 1;
if(index - 1 == -1)
{
prevButton.disabled = "disabled";
}
else
{
prevButton.disabled = "";
}
document.getElementById("next").disab… = "";
quote = quotes[index];
quoteDiv.innerHTML = "<p>" + quote + "</p>";
}

On the body tage, put onload="getFirst();"

In the body part, where you want the quote to show, make a div with the id="quotebox", and then make two buttons, one with an id="prev" and one with an id="next", and for each button, onclick="getPrevious();" or onclick="getNext()";

 

Actually, rather than put JavaScript in the body tag, just write a function that gets called when the page loads that will handle the onload event handler. That way you can call multiple onloads.

window.onload = function() {
	getFirst();
	// other functions that use onload="" go here
}

Code (markup):

I also recommend using document.getElementByID(); to target those IDs that need the previous and next calls rather than inlining them within the HTML code.