By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,379 Members | 1,870 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,379 IT Pros & Developers. It's quick & easy.

prob

P: n/a
Anyone know how to do this?

I have 25 *.gif files, all of the same dimensions. I want to display one at
a time in the top middle of a dynamic web page, with 25 links below the
display that will, when clicked, each display the corresponding file (I want
to make just one web page to display the paintings rather than 25 separate
pages).

If anything, could I just have a link to a page that does this so I can
figure it out myself?
Jul 20 '05 #1
Share this Question
Share on Google+
8 Replies


P: n/a
While the city slept, Robot Tree <st***@stevedurkin.net> feverishly
typed:
Anyone know how to do this?

I have 25 *.gif files, all of the same dimensions. I want to display
one at a time in the top middle of a dynamic web page, with 25 links
below the display that will, when clicked, each display the
corresponding file (I want to make just one web page to display the
paintings rather than 25 separate pages).


Try something along the lines of the following;

<html>
<head>
<title>Picture Viewer</title>

<script type="text/javascript">
<!-- Hide

function changeImg(url, alt)
{
document.images.imgView.src = url;
document.images.imgView.alt = alt;
}

// Dunhidin -->
</script>

</head>
<body>
<p><img src="pict1.jpg" name="imgView" width="300" height="300" alt="Picture
1"></p>
<p>
[ <a href="pict1.jpg" target="_blank" onclick="changeImg('pict1.jpg',
'Picture 1'); return false">1</a> |
<a href="pict2.jpg" target="_blank" onclick="changeImg('pict2.jpg', 'Picture
2'); return false">2</a> |
<a href="pict3.jpg" target="_blank" onclick="changeImg('pict3.jpg', 'Picture
3'); return false">3</a> |
<a href="pict4.jpg" target="_blank" onclick="changeImg('pict4.jpg', 'Picture
4'); return false">4</a> |
<a href="pict5.jpg" target="_blank" onclick="changeImg('pict5.jpg', 'Picture
5'); return false">5</a> ]
</p>
</body>
</html>

.... Tested and working on IE6, Moz5 and NS4.7 (though the alt text doesn't
change in NS4.7).

You may be better off using a server-side solution such as PHP, though, if
that option is available to you. I would happily rewrite the script for PHP
if you wanted.

Cheers,
Nige

--
Nigel Moss.

Email address is not valid. ni***@nigenetDOG.org.uk. Take the dog out!
http://www.nigenet.org.uk | Boycott E$$O!! http://www.stopesso.com
"How strange the change from major to minor..."
Jul 20 '05 #2

P: n/a
"nice.guy.nige" <ni********@deadspam.com> wrote in message
news:bf************@ID-112325.news.uni-berlin.de...
While the city slept, Robot Tree <st***@stevedurkin.net> feverishly
typed:
Anyone know how to do this?

I have 25 *.gif files, all of the same dimensions. I want to display
one at a time in the top middle of a dynamic web page, with 25 links
below the display that will, when clicked, each display the
corresponding file (I want to make just one web page to display the
paintings rather than 25 separate pages).
Try something along the lines of the following;

<html>
<head>
<title>Picture Viewer</title>

<script type="text/javascript">
<!-- Hide

function changeImg(url, alt)
{
document.images.imgView.src = url;
document.images.imgView.alt = alt;
}

// Dunhidin -->
</script>

</head>
<body>
<p><img src="pict1.jpg" name="imgView" width="300" height="300"

alt="Picture 1"></p>
<p>
[ <a href="pict1.jpg" target="_blank" onclick="changeImg('pict1.jpg',
'Picture 1'); return false">1</a> |
<a href="pict2.jpg" target="_blank" onclick="changeImg('pict2.jpg', 'Picture 2'); return false">2</a> |
<a href="pict3.jpg" target="_blank" onclick="changeImg('pict3.jpg', 'Picture 3'); return false">3</a> |
<a href="pict4.jpg" target="_blank" onclick="changeImg('pict4.jpg', 'Picture 4'); return false">4</a> |
<a href="pict5.jpg" target="_blank" onclick="changeImg('pict5.jpg', 'Picture 5'); return false">5</a> ]
</p>
</body>
</html>

... Tested and working on IE6, Moz5 and NS4.7 (though the alt text doesn't
change in NS4.7).

You may be better off using a server-side solution such as PHP, though, if
that option is available to you. I would happily rewrite the script for PHP if you wanted.

Cheers,
Nige

--
Nigel Moss.

Email address is not valid. ni***@nigenetDOG.org.uk. Take the dog out!
http://www.nigenet.org.uk | Boycott E$$O!! http://www.stopesso.com
"How strange the change from major to minor..."


Thanks for the solution, Nigel. The reason I asked for a javascript is that
after initially asking for a php solution (in alt.php), all I received was,
"you should use a client-side solution such as javascript or dhtml." I hate
to trouble you into contriving a whole new solution if the one you've
provided works fine, but if you don't mind I'd at least like to know what
some of the differences are between using, for this particular problem,
client-side and server-side code so that I can improve my decisions in
choosing the right type of solution before requesting one.
Thanks again, Nigel.
Steve
Jul 20 '05 #3

P: n/a
While the city slept, Robot Tree <st***@stevedurkin.net> feverishly
typed:
"nice.guy.nige" <ni********@deadspam.com> wrote in message
news:bf************@ID-112325.news.uni-berlin.de... [...]
... Tested and working on IE6, Moz5 and NS4.7 (though the alt text
doesn't change in NS4.7).

You may be better off using a server-side solution such as PHP,
though, if that option is available to you. I would happily rewrite
the script for PHP if you wanted.

Thanks for the solution, Nigel. The reason I asked for a javascript
is that after initially asking for a php solution (in alt.php), all I
received was, "you should use a client-side solution such as
javascript or dhtml."
I hate to trouble you into contriving a whole
new solution if the one you've provided works fine, but if you don't
mind I'd at least like to know what some of the differences are
between using, for this particular problem, client-side and server-
side code so that I can improve my decisions in choosing the right
type of solution before requesting one. Thanks again, Nigel.


No worries. I have one lying around here somewhere! (It's actually a fairly
simple script). I'll sort one out for you later. But now... It's pub time!

Cheers,
Nige

--
Nigel Moss.

Email address is not valid. ni***@nigenetDOG.org.uk. Take the dog out!
http://www.nigenet.org.uk | Boycott E$$O!! http://www.stopesso.com
"How strange the change from major to minor..."
Jul 20 '05 #4

P: n/a
While the city slept, Robot Tree <st***@stevedurkin.net> feverishly
typed:
"nice.guy.nige" <ni********@deadspam.com> wrote in message
news:bf************@ID-112325.news.uni-berlin.de... [...]
... Tested and working on IE6, Moz5 and NS4.7 (though the alt text
doesn't change in NS4.7).

You may be better off using a server-side solution such as PHP,
though, if that option is available to you. I would happily rewrite
the script for PHP if you wanted.

Thanks for the solution, Nigel. The reason I asked for a javascript
is that after initially asking for a php solution (in alt.php), all I
received was, "you should use a client-side solution such as
javascript or dhtml." I hate to trouble you into contriving a whole
new solution if the one you've provided works fine, but if you don't
mind I'd at least like to know what some of the differences are
between using, for this particular problem, client-side and server-
side code so that I can improve my decisions in choosing the right
type of solution before requesting one. Thanks again, Nigel.


Hi Steve,

One big advantage of server-side over client-side is that you don't have to
rely on the products used by the end-user. The server-side script produces
the html code and the server serves it to the end user. Shazam! The
javascript version relies on javascript being available to - and enabled
by - the end user. Also, different browsers handle the javascript in
different ways, wheras here it is sending nothing but html to the end user,
which will be interpreted in pretty much the same way by most browsers.

Have a go at this. Save it as imgDisplay.php and set the path to point to
where the images are stored.

<html>
<head>
<title>Imgage Display using PHP</title>
</head>

<body>
<h1>Image Display using PHP</h1>

<?PHP
if(!isset($pn)) {
$pn = "pict1.jpg";
$alt = "picture one";
}

$path="./";
$picname = $path.$pn;
$pic_size = getimagesize("$picname");

print("<p>");
print("<img src=\"$picname\" $pic_size[3] alt=\"$alt\">");
print("</p>");
?>

<p>[
<a href="imgDisplay.php?pn=pict1.jpg&amp;alt=picture% 20one">1</a> |
<a href="imgDisplay.php?pn=pict2.jpg&amp;alt=picture% 20two">2</a> |
<a href="imgDisplay.php?pn=pict3.jpg&amp;alt=picture% 20three">3</a> |
<a href="imgDisplay.php?pn=pict4.jpg&amp;alt=picture% 20four">4</a> |
<a href="imgDisplay.php?pn=pict5.jpg&amp;alt=picture% 20five">5</a>
]</p>

</body>
</html>

.... This could be expanded to hold all the alt texts in an array (so you
could have more complicated alt text without ending up with an
incomprehensible URL!) for example.

Hope that helps,
Nige

--
Nigel Moss.

Email address is not valid. ni***@nigenetDOG.org.uk. Take the dog out!
http://www.nigenet.org.uk | Boycott E$$O!! http://www.stopesso.com
"How strange the change from major to minor..."
Jul 20 '05 #5

P: n/a
"nice.guy.nige" <ni********@deadspam.com> wrote in message
news:bf************@ID-112325.news.uni-berlin.de...
While the city slept, Robot Tree <st***@stevedurkin.net> feverishly
typed:
"nice.guy.nige" <ni********@deadspam.com> wrote in message
news:bf************@ID-112325.news.uni-berlin.de... [...]
... Tested and working on IE6, Moz5 and NS4.7 (though the alt text
doesn't change in NS4.7).

You may be better off using a server-side solution such as PHP,
though, if that option is available to you. I would happily rewrite
the script for PHP if you wanted.

Thanks for the solution, Nigel. The reason I asked for a javascript
is that after initially asking for a php solution (in alt.php), all I
received was, "you should use a client-side solution such as
javascript or dhtml." I hate to trouble you into contriving a whole
new solution if the one you've provided works fine, but if you don't
mind I'd at least like to know what some of the differences are
between using, for this particular problem, client-side and server-
side code so that I can improve my decisions in choosing the right
type of solution before requesting one. Thanks again, Nigel.


Hi Steve,

One big advantage of server-side over client-side is that you don't have

to rely on the products used by the end-user. The server-side script produces
the html code and the server serves it to the end user. Shazam! The
javascript version relies on javascript being available to - and enabled
by - the end user. Also, different browsers handle the javascript in
different ways, wheras here it is sending nothing but html to the end user, which will be interpreted in pretty much the same way by most browsers.

Have a go at this. Save it as imgDisplay.php and set the path to point to
where the images are stored.

<html>
<head>
<title>Imgage Display using PHP</title>
</head>

<body>
<h1>Image Display using PHP</h1>

<?PHP
if(!isset($pn)) {
$pn = "pict1.jpg";
$alt = "picture one";
}

$path="./";
$picname = $path.$pn;
$pic_size = getimagesize("$picname");

print("<p>");
print("<img src=\"$picname\" $pic_size[3] alt=\"$alt\">");
print("</p>");
?>

<p>[
<a href="imgDisplay.php?pn=pict1.jpg&amp;alt=picture% 20one">1</a> |
<a href="imgDisplay.php?pn=pict2.jpg&amp;alt=picture% 20two">2</a> |
<a href="imgDisplay.php?pn=pict3.jpg&amp;alt=picture% 20three">3</a> |
<a href="imgDisplay.php?pn=pict4.jpg&amp;alt=picture% 20four">4</a> |
<a href="imgDisplay.php?pn=pict5.jpg&amp;alt=picture% 20five">5</a>
]</p>

</body>
</html>

... This could be expanded to hold all the alt texts in an array (so you
could have more complicated alt text without ending up with an
incomprehensible URL!) for example.

Hope that helps,
Nige

--
Nigel Moss.

Email address is not valid. ni***@nigenetDOG.org.uk. Take the dog out!
http://www.nigenet.org.uk | Boycott E$$O!! http://www.stopesso.com
"How strange the change from major to minor..."


Wow, thanks Nigel! This is great information...I'm learning more and more
about how this stuff works. It really makes it so much easier to learn when
the code is so tidy like you've made it. I've been using www.php.net to
learn more about the code you gave me and I swear I've almost got it
working. I've adapted your solution to fit the proper titles, filenames,
file extensions, etc. As you will see, there are 25 gifs I'm trying to have
available for display. The error message that I keep getting is this:

"Parse error: parse error, unexpected T_STRING in
d:\websites\stevedurkinnet\wwwroot\TMPbjeclick0n.p hp on line 27"

Line 27 is the first of the 25 lines that look like this: <a href="problem
lies somewhere in here"></a>.
I'm developing a decent understanding of some of the variables you've
defined and how they interact, but I don't understand the purpose of the
$alt variable or the &amp thing that separates the href="XXXXXX" from the
alt="XXXXXX" You've been such great help so far that I feel guilty asking
anything else of you, but I feel that I am so very close to having the final
solution. And for what it's worth to you, you'll be the first person to see
my digital paintings.

Thanks for everything, Nigel,
Steve

Here is the code:

<html>
<head>
<title>Paintings</title>
<link href="Style Sheets/Style01.css" rel="stylesheet" type="text/css">
</head>

<body>
<div align="center">

<?PHP
if(!isset($pn)) {
$pn = "Animals.gif";
$alt = "picture one";
}

$path = "Images\Paintings\";
$picname = $path.$pn;
$pic_size = getimagesize($picname);

print(<p>);
print(<img src=\"$picname\" $pic_size[3] alt=\"$alt\">);
print(</p>);
?>

<p>
<a href="Paintings.php?pn=Animals.gif&amp;alt=picture %20one">Animals</a> |
<a
href="Paintings.php?pn=Antimatter.gif&amp;alt=pict ure%20two">Antimatter</a>
|
<a href="Paintings.php?pn=Battle.gif&amp;alt=picture% 20three">Battle</a> |
<a href="Paintings.php?pn=Bear.gif&amp;alt=picture%20 four">Bear</a> |
<a href="Paintings.php?pn=Bird.gif&amp;alt=picture%20 five">Bird</a> |
<a href="Paintings.php?pn=Cabin.gif&amp;alt=picture%2 0six">Cabin</a> |
<a href="Paintings.php?pn=Castle.gif&amp;alt=picture% 20seven">Castle</a> |
<a href="Paintings.php?pn=City.gif&amp;alt=picture%20 eight">City</a> |
<a href="Paintings.php?pn=Colorado.gif&amp;alt=pictur e%20nine">Colorado</a>
|
<a
href="Paintings.php?pn=Droidling%20and%20Mother.gi f&amp;alt=picture%20ten">D
roidling and Mother</a> |
<a href="Paintings.php?pn=Dude.gif&amp;alt=picture%20 eleven">Dude</a> |
<a
href="Paintings.php?pn=Eating%20Demon.gif&amp;alt= picture%20twelve">Eating
Demon</a> |
<a href="Paintings.php?pn=Faces.gif&amp;alt=picture%2 0thirteen">Faces</a> |
<a href="Paintings.php?pn=House.gif&amp;alt=picture%2 0fourteen">House</a> |
<a href="Paintings.php?pn=Path.gif&amp;alt=picture%20 fifteen">Path</a> |
<a href="Paintings.php?pn=Phantom.gif&amp;alt=picture %20sixteen">Phantom</a>
|
<a href="Paintings.php?pn=Plan.gif&amp;alt=picture%20 seventeen">Plan</a> |
<a href="Paintings.php?pn=Skull.gif&amp;alt=picture%2 0eighteen">Skull</a> |
<a
href="Paintings.php?pn=Snowman.gif&amp;alt=picture %20nineteen">Snowman</a> |
<a href="Paintings.php?pn=Star.gif&amp;alt=picture%20 twenty">Star</a> |
<a href="Paintings.php?pn=Tree.gif&amp;alt=picture%20 twentyone">Tree</a> |
<a href="Paintings.php?pn=Vortex.gif&amp;alt=picture% 20twentytwo">Vortex</a>
|
<a href="Paintings.php?pn=Warp.gif&amp;alt=picture%20 twentythree">Warp</a> |
<a
href="Paintings.php?pn=Wizard.gif&amp;alt=picture% 20twentyfour">Wizard</a> |
<a href="Paintings.php?pn=Wolf.gif&amp;alt=picture%20 twentyfive">Wolf</a>
</p>

</div>
</body>
</html>
Jul 20 '05 #6

P: n/a
While the city slept, Robot Tree <st***@stevedurkin.net> feverishly
typed:

[...]
"Parse error: parse error, unexpected T_STRING in
d:\websites\stevedurkinnet\wwwroot\TMPbjeclick0n.p hp on line 27"

[...]

Hi Steve,

Just got back from the pub this time... so, I'll have a look at your code
tomorrow! ;-) Will report back...

Cheers,
Nige

--
Nigel Moss.

Email address is not valid. ni***@nigenetDOG.org.uk. Take the dog out!
http://www.nigenet.org.uk | Boycott E$$O!! http://www.stopesso.com
"How strange the change from major to minor..."
Jul 20 '05 #7

P: n/a

"nice.guy.nige" <ni********@deadspam.com> wrote in message
news:bf************@ID-112325.news.uni-berlin.de...
While the city slept, Robot Tree <st***@stevedurkin.net> feverishly
typed:

[...]
"Parse error: parse error, unexpected T_STRING in
d:\websites\stevedurkinnet\wwwroot\TMPbjeclick0n.p hp on line 27"

[...]

Hi Steve,

Just got back from the pub this time... so, I'll have a look at your code
tomorrow! ;-) Will report back...

Cheers,
Nige

--
Nigel Moss.

Email address is not valid. ni***@nigenetDOG.org.uk. Take the dog out!
http://www.nigenet.org.uk | Boycott E$$O!! http://www.stopesso.com
"How strange the change from major to minor..."


Hey Nigel,
I inserted a backslash between the equals sign and the quotation mark in
each of the problem lines. They now appear like this:

<a href=\"Paintings.php?...... instead of
<a href="Paintings.php?......

It appears to me to have solved that particular parse error, because I'm now
getting a new parse error on a later line, which I suppose means that every
line preceding the error line is interpretable, but please let me know if I
am wrong in my conjecture. Anyhow, the new error is on line 55, which is
the last line:

</html>

Here is the error:

Parse error: parse error, unexpected $end in
d:\websites\stevedurkinnet\wwwroot\TMP3ce85ifltp.p hp on line 55

I haven't even begun trying to figure this one out because I didn't want to
waste your with the problem that appears to now be solved (but again I could
be wrong about that too), and I can assure you I consider it unhealthy to
rely on others without trying to solve these problems myself, but I'd
appreciate any readily avaliable solutions because I'm eager to get this
page up.

Thanks Nige,
Steve

Here is the updated code:
<html>
<head>
<title>Paintings</title>
<link href="Style Sheets/Style01.css" rel="stylesheet" type="text/css">
</head>

<body>
<div align="center">

<?PHP
if(!isset($pn)) {
$pn = "Animals.gif";
$alt = "picture one";
}

$path = "Images\Paintings\";
$picname = $path.$pn;
$pic_size = getimagesize($picname);

print(<p>);
print(<img src=\"$picname\" $pic_size[3] alt=\"$alt\">);
print(</p>);
?>

<p>
<a href=\"Paintings.php?pn=Animals.gif&amp;alt=Animal s.gif">Animals</a> |
<a
href=\"Paintings.php?pn=Antimatter.gif&amp;alt=pic ture%20two">Antimatter</a>
|
<a href=\"Paintings.php?pn=Battle.gif&amp;alt=picture %20three">Battle</a> |
<a href=\"Paintings.php?pn=Bear.gif&amp;alt=picture%2 0four">Bear</a> |
<a href=\"Paintings.php?pn=Bird.gif&amp;alt=picture%2 0five">Bird</a> |
<a href=\"Paintings.php?pn=Cabin.gif&amp;alt=picture% 20six">Cabin</a> |
<a href=\"Paintings.php?pn=Castle.gif&amp;alt=picture %20seven">Castle</a> |
<a href=\"Paintings.php?pn=City.gif&amp;alt=picture%2 0eight">City</a> |
<a href=\"Paintings.php?pn=Colorado.gif&amp;alt=pictu re%20nine">Colorado</a>
|
<a
href=\"Paintings.php?pn=Droidling%20and%20Mother.g if&amp;alt=picture%20ten">
Droidling and Mother</a> |
<a href=\"Paintings.php?pn=Dude.gif&amp;alt=picture%2 0eleven">Dude</a> |
<a
href=\"Paintings.php?pn=Eating%20Demon.gif&amp;alt =picture%20twelve">Eating
Demon</a> |
<a href=\"Paintings.php?pn=Faces.gif&amp;alt=picture% 20thirteen">Faces</a> |
<a href=\"Paintings.php?pn=House.gif&amp;alt=picture% 20fourteen">House</a> |
<a href=\"Paintings.php?pn=Path.gif&amp;alt=picture%2 0fifteen">Path</a> |
<a
href=\"Paintings.php?pn=Phantom.gif&amp;alt=pictur e%20sixteen">Phantom</a> |
<a href=\"Paintings.php?pn=Plan.gif&amp;alt=picture%2 0seventeen">Plan</a> |
<a href=\"Paintings.php?pn=Skull.gif&amp;alt=picture% 20eighteen">Skull</a> |
<a
href=\"Paintings.php?pn=Snowman.gif&amp;alt=pictur e%20nineteen">Snowman</a>
|
<a href=\"Paintings.php?pn=Star.gif&amp;alt=picture%2 0twenty">Star</a> |
<a href=\"Paintings.php?pn=Tree.gif&amp;alt=picture%2 0twentyone">Tree</a> |
<a
href=\"Paintings.php?pn=Vortex.gif&amp;alt=picture %20twentytwo">Vortex</a> |
<a href=\"Paintings.php?pn=Warp.gif&amp;alt=picture%2 0twentythree">Warp</a>
|
<a
href=\"Paintings.php?pn=Wizard.gif&amp;alt=picture %20twentyfour">Wizard</a>
|
<a href=\"Paintings.php?pn=Wolf.gif&amp;alt=picture%2 0twentyfive">Wolf</a>
</p>

</div>
</body>
</html>
Jul 20 '05 #8

P: n/a
While the city slept, Robot Tree <st***@stevedurkin.net> feverishly
typed:
Okay ignore that last one too...I've fixed another thing...how about
this? I'll get back to this A.S.A. I get to a real stopping
point...then I'll ask you for help...I'm almost there, Nige.
Thanks for everything,


Good luck. Hope you get it sorted out. If you do have any further problems,
then I will be only too glad to help out if I can. As this is now a PHP
issue and no longer a javascript one (And therefore off-topic in this
group), it would probably be better if you sent any more correspondence on
the matter straight to my email (note that my email address is an
autoresponder. Follow the instructions in my Sig below for the real
address).

Let me know how you get on in any case.

Cheers,
Nige

--
Nigel Moss.

Email address is not valid. ni***@nigenetDOG.org.uk. Take the dog out!
http://www.nigenet.org.uk | Boycott E$$O!! http://www.stopesso.com
"How strange the change from major to minor..."
Jul 20 '05 #9

This discussion thread is closed

Replies have been disabled for this discussion.