help with Image Thumbnail Viewer II

[jstgermain]

i really like this script (Image Thumbnail Viewer II), but i would like to modify it, and i am having some major dificulties in doing so. i like how it displays the image in the same page, but i want it to have more than three images to select from, and i know if i add more than three, it will obviously display all or them to choose from. what i want it to do is, have it only display three pics at one time, and for the rest of the imgages, i want it to give you a next and previous button when appropriate to display the other ones, only three at a time. when it gets through the list of the images, the next button should disappear, and only have the previous button still visable. same goes for when you are at the beginning. to see an example of what i mean visit http://www.methodcomptech.com/samplework.html. right now i have it displaying 2 images across and three down, but i only want 3 across and 0 down wich i can achieve with my current script, but i cant get it to not display in a popup since i did not write the script and i am not that great with javascript to begin with. so if you could help me, that would be great, and of course if i use it, i will keep your name on the script.

just a note, it is not the Image Thumbnail viewer script on my site currently, and it will not be for my site. I will be using it on a client's site. i am however using it on a test site i am building http://www.methodcomptech.com/images/dad under the b & w link, and it would actually be a big help to use something like what i am describing for that site too, but it would need to have a way for me to tell it how many images to display across and how many down, like it is donw in the site right now. thanks in advance for any help.

[jscheuer1]

I really didn't like that image thumbnail II script too well, the fade in effect wasn't cross browser. So, a little while back I wrote my own version based on the new Ultimate Fade In Slideshow. I've combined that script with a modified version of PHP Photo Album script. And added a little intuitive communication between the two. It still isn't exactly what you say you want but, I'm tired of messing with it for just now and I like the way the pages are treated better. You said you wanted buttons to disappear when they were not applicable. Here I've made them so they cycle back to the beginning or end once they have reached the limit in the direction they were going. Here's a link to a demo. The server is a tad slow but the once the images load, there should be no problem getting the idea. Also, in an effort to save time, I've committed a big no, no. I've let the browser resize the images to create the thumbnails. In actual practice, an individual set of thumbnails should be made.

[jstgermain]

it is almost exactly what i am looking for. i will see if i can modify it the rest of the way now that you have a pase for it. i will give full credit where deserved of course. i would also like to put a link under my affiliates section to your site so that people my have the great pleasure of having you help them too. if you would like me to do so, let me know and you can reach me on MSN @ Prophecy_Internet@hotmail.com or email me at jstgermain@methodcomptech.com thanks for your help. can you send a zip file of the script to me?

[jstgermain]

john, also, is there a way to have it display the image once clicked, instead of onmouseover? i couldnt find it in the code. i want to change it to onclick, but maybe i am blind. i will look some more, but let me know if it is not in there, how i can change it. thanks again for your help.

edit:
ooops, never mind, i found it. all i had to do was a damn find and replace search. hehe. ok, but now i am having trouble with it not displaying the proper image once the next button is clicked. it will display the second image instead of the first. here is a link. http://www.methodcomptech.com/testgallery when you click the image, it displays perfectly, but when you just click next, it doesn't. please help

[jscheuer1]

That has nothing to do with changing to onclick. I made a mistake when determining how to calculate which slide would begin each 'page' enlarged. Near the end of the last script change this:

switchFade(Math.ceil(galleryarray.length/totalslots*(p-1)), dynimages)

to:

switchFade(startpoint, dynimages)

[jstgermain]

you are an ace man. thanks. i would have never figured that part out. now the script is 99% perfect. the only thing i would prefer is to have the previous and next buttons appear and dissappear when nessessary. if you can figure that part out, let me know. otherwise, i will use it how it is. thanks for your help.

[jscheuer1]

Well, I only said I was tired of dealing with the script, not finished. I like the way I have the buttons handled and wanted you to at least have a look at it. It is the way I would do it. Here's a way to do it as I believe you were describing - at the end of the second (last large) script, where it says 'var k=1', add this function so that it now looks like so:

var k=1
function controls(dir){
k=k+dir
jumptopage(k);
document.getElementById('next').style.visibility=document.getElementById('back').style.visibility='visible'
if (k>=Math.ceil(galleryarray.length/totalslots))
document.getElementById('next').style.visibility="hidden";
else if (k<=1)
document.getElementById('back').style.visibility="hidden";
}

</script>

And change the inputs' HTML to this:

<input id="next" type="button" onclick="controls(1)" value="Next">&nbsp;&nbsp;<span id="pageNum">Page 1</span>&nbsp;
<input id="back" style="visibility:hidden;" type="button" onclick="controls(-1)" value="Previous">

That's it!

[jscheuer1]

Also, I would sooner opt for disabling the undesirable button than hiding it:

var k=1
function controls(dir){
k=k+dir
jumptopage(k);
document.getElementById('next').disabled=document.getElementById('back').disabled=0
if (k>=Math.ceil(galleryarray.length/totalslots))
document.getElementById('next').disabled=1;
else if (k<=1)
document.getElementById('back').disabled=1;
}

</script>

and:

<input id="next" type="button" onclick="controls(1)" value="Next">&nbsp;&nbsp;<span id="pageNum">Page 1</span>&nbsp;
<input id="back" disabled type="button" onclick="controls(-1)" value="Previous">