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.