Click to See Complete Forum and Search --> : "Gallery Viewer" script
alvamgag
03-18-2003, 09:53 AM
Hi,
My name is Albert. I'm very junior when it comes to web design. I've been trying to create a web page for my Dad's granite store business. I've been searching for a similar script to "Gallery Viewer", written by Jenny Blewitt, for a long time. This is very close to what I need. If I tell you what I'm trying to accomplish, could you help me out please?
Basically, I would need to modify your script so that it would link to JPGs in a sub-folder of here the main index page would be. Your script gets JPGs in the same folder the main page is.
Example:
THE SCRIPT:
FOLDER_A/GalleryViewer.html
FOLDER _A/p1.jpg
FOLDER _A/p2.jpg
FOLDER _A/p3.jpg
FOLDER _A/p4.jpg
MINE:
FOLDER_A/GalleryViewer.html
FOLDER _A/images/p1.jpg
FOLDER _A/images/p2.jpg
FOLDER _A/images/p3.jpg
FOLDER _A/images/p4.jpg
I've tried changing:
<td><a href="javascript:doPic('p5.jpg');"><img src="p5.jpg" width=90 height=60 border=0></a></td>
to:
<td><a href="javascript:doPic('images\p5.jpg');"><img src="p5.jpg" width=90 height=60 border=0></a></td>
but it does not work.
Can you please help.
Thank you very much in advance.
/Albert.
khalidali63
03-18-2003, 10:13 AM
from the line which you posted as your code change it to this one
<a href="javascript:doPic('images/p5.jpg');"><img src="images/p5.jpg" width=90 height=60 border=0></a>
Offcourse if there is something else that is wrong with the script it will still not work
Cheers
Khalid
alvamgag
03-18-2003, 10:27 AM
Hi khalid,
I made an error in my original post.
This is what I have, but it does not work.
<td><a href="javascript:dopic('/images/granites/amarello.jpg');"><img src="images/s_granites/amarello.jpg" width=80 height=50></A></td>
Notice that for <img src=...., the images are in a subfolder and that works.
I did try to put the images under the same folder as the index file and it does work so I know the script works.
Thanks a million for you help.
P.S.
I forgot to ask something. Would I need to modify this in the header?
function doPic(imgName) {
if (ns3up || ie4up) {
imgOn = ("" + imgName);
document.mainpic.src = imgOn;
/Albert.
Nevermore
03-18-2003, 02:46 PM
If youre server supports PHP and MySQL, then there is a script at http://forums.webdeveloper.com/showthread.php?s=&threadid=4727 that will dynamically generate galleries as and when needed, if your just put the image sourcec into a database.
alvamgag
03-18-2003, 02:58 PM
Hi cijori,
No, it does not.
The web page I creating is not on a server, it's on a HD.
/Albert.
Nevermore
03-18-2003, 03:04 PM
How are you going to get it on the web?
alvamgag
03-18-2003, 03:08 PM
I'm going to sign up with Videotron (here in Montreal), a high speed internet provider. They have a backage that offers so many mega bytes of disk space for my own web page.
Nedals
03-18-2003, 05:07 PM
<a href="javascript:dopic('/images/gran.....')">
function doPic(imgName)
Javascript is CASE SENSITIVE! :)
Hey! What's up with this forum! It's putting a space in javascript that is NOT in my post. :confused:
alvamgag
03-19-2003, 08:54 AM
Hi Nedals,
Thanks for your help, but it still does not work.
I believed this was a simple think to do, but maybe I was wrong. I just can't understand why it takes the jpgs that are in the same folder as the main index file but not the jpgs that are in a subfolder.
Here is the complete script. If anyone figures it out, please let me know.
Thanks to all.
/Albert.
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
browserName = navigator.appName;
browserVer = parseInt(navigator.appVersion);
ns3up = (browserName == "Netscape" && browserVer >= 3);
ie4up = (browserName.indexOf("Microsoft") >= 0 && browserVer >= 4);
function dopic(imgName) {
if (ns3up || ie4up) {
imgOn = ("" + imgName);
document.mainpic.src = imgOn;
}
}
// End -->
</script>
</HEAD>
<BODY>
<center>
<table width=360 border=0 cellspacing=0 cellpadding=0>
<tr>
<td><a href="javascript:dopic('amarello.jpg');"><img src="p1.jpg" width=90 height=60 border=0></a></td>
<td><a href="javascript:dopic('p2.jpg');"><img src="p2.jpg" width=90 height=60 border=0></a></td>
<td><a href="javascript:dopic('p3.jpg');"><img src="p3.jpg" width=90 height=60 border=0></a></td>
<td><a href="javascript:dopic('p4.jpg');"><img src="p4.jpg" width=90 height=60 border=0></a></td>
</tr>
<tr>
<td colspan=4 align=center><img name="mainpic" src="p1.jpg" width=360 height=240 border=0></td>
<!--<td colspan=4 align=center><img name="mainpic" src="/images/s_granites/amarello.jpg" width=360 height=240 border=0></td>-->
</tr>
<tr>
<td><a href="javascript:dopic('/images/granites/p6.jpg');"><img src="images/s_granites/amarello.jpg" width=80 height=50></A></td>
<td><a href="javascript:dopic('/images/granites/p7.jpg');"><img src="images/s_granites/bianco_cardinale3.jpg" width=80 height=50></A></td>
<td><a href="javascript:dopic('p7.jpg');"><img src="images/s_granites/blue_eyes.jpg" width=90 height=60 border=0></a></td>
<td><a href="javascript:dopic('p8.jpg');"><img src="images/s_granites/madura.jpg" width=90 height=60 border=0></a></td>
</tr>
</table>
</center>
<p><center>
<font face="arial, helvetica" size="-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>
<!-- Script Size: 2.00 KB -->
</HTML>
Nedals
03-19-2003, 12:16 PM
<HTML><HEAD><title></title>
<SCRIPT LANGUAGE="JavaScript">
<!--
function dopic(imgName) {
if (document.images) { // this is an easy way to deal with the old browsers
document['mainpic'].src = imgName;
}
}
//-->
</script>
</HEAD>
<BODY>
<center>
<table width=360 border=0 cellspacing=0 cellpadding=0>
<tr><td><a href="javascript:dopic('images/sample1.jpg');"><img src="images/sample1.jpg" width=90 height=60 border=0></a></td>
<td><a href="javascript:dopic('images/sample2.jpg');"><img src="images/sample2.jpg" width=90 height=60 border=0></a></td>
<td><a href="javascript:dopic('images/sample3.jpg');"><img src="images/sample3.jpg" width=90 height=60 border=0></a></td>
<td><a href="javascript:dopic('images/sample4.jpg');"><img src="images/sample4.jpg" width=90 height=60 border=0></a></td></tr>
<tr><td colspan=4 align=center><img name="mainpic" src="images/sample1.jpg" width=220 height=200 border=0></td></tr>
</table>
</center>
</body>
</html>
This should work for you. I 'assume' that you are blowing up a thumbnail, onClick, into the lower image.
UPDATE: PLEASE EXPLAIN
Why is the word 'javascript' splitting into two words in my post?? It certainly doesn't help newcommers to javascript. Especially when I read a number of posts that talk about java, which is a totally different language.
alvamgag
03-19-2003, 12:28 PM
Hi Nedals,
Thank you. It worked. I also realized, a few minutes ago that I was add a "/" in from of the folder "images" and that was sending it back to the root directory.
<td><a href="javascript:dopic('/images/granites/p6.jpg');">
It should have been...
<td><a ref="javascript:dopic('images/granites/p6.jpg');">
Thanks all for your help.
/Albert.