Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > problem with different thumbnails opening same window

Reply
Thread Tools

problem with different thumbnails opening same window

 
 
Danny
Guest
Posts: n/a
 
      09-14-2004
hi, lately i've been working on a website and i have used a bit of
javascript although i'm not an expert in this mather.
On the page there are 3 thumbnails and when you click on a thumbnail a
window with a picture (and text) on it opens.
Each thumbnail should open a window with a different picture. So this is
where the problem comes in : no matter wich thumbnail I click on, it's
always the same window with the same picture that opens...
Does it has something to do with the name of each window or the
showWindow() -function or the .....
the url is http://users.pandora.be/zwerfwagen/test.html


a second problem is the following : when you click on a thumbnail and the
new window opens, it is centered on the screen, but this is only for the
resolution of my screen. how can i make sure that the window is always
centered, no matter what type of screen/resolution is used?

any help would be appreciated
Danny


 
Reply With Quote
 
 
 
 
Robert
Guest
Posts: n/a
 
      09-15-2004
"Danny" <(E-Mail Removed)> wrote in message news:<4UA1d.245715$(E-Mail Removed)-ops.be>...
> hi, lately i've been working on a website and i have used a bit of
> javascript although i'm not an expert in this mather.


You need to go to the library or bookstore and get a book on
Javascript. The book recommended by this group is: Javascript: The
Deinitive Guide by David Flanagan.

For a more basic book, I would consider: HTML for the World Wide Web
with XHTML and CSS: Visual QuickStart Guide, Fifth Edition by
Elizabeth Castro. This book is in the style of a cookbook. This is
good if it has what you want, but bad if not.

You need to abandoned the user of Front Page. It isn't compatible
with Javascript nor with browser other than IE. Front Page will kind
of work but you will get burnt by it eventually.

I could not exacly determine how you wanted your script to work but
here is something that may help.

I posted an example using frames here:

http://groups.google.com/groups?q=rc...gle.com&rnum=6

It has the subject of Re: change image in another frame.


Here is an example using CSS:

Robert

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Swap images</title>
<style type="text/css">

#thumbs{
float: left;
width: 20%;
padding-left: 5px;
padding-bottom: 20px;
}

#picture{
visibility: hidden;
float: right;
width: 74%;
padding-bottom: 20px;
border-width: medium;
border-style: dotted;
border-color: red;
background-color: grey;

}

#footer{
clear: both;
padding-left: 20px;
padding-right: 20px;
padding-top: 5px;
padding-bottom: 5px;
background: #eee;
}

</style>

<script type="text/javascript">
var nasaPath = "http://spaceplace.nasa.gov" +
"/en/educators/images/solarsystem/";

/*
An easier way to do this would be to make a transparent gif
image. Using a transparent gif image would avoid the use
of the css hidden visibility.

Netscape waits until the image is complete to display the new
image. In the meantime, Netscape displays the old image.
*/

var hideFirstPicture = "hidden";

function genImage(link)
{
var data = "<a href='" + nasaPath + link + "_L.jpg'>\n" +
"<img src='" + nasaPath + link + "_T.jpg'\n" +
"onclick='return changeImg(\"" +
nasaPath + link + "_L.jpg\");'>\n" +
"<\/a>";
document.writeln(data);
document.writeln("<br><br>");
}

function changeImg(name)
{

document.getElementById("picture").style.visibilit y = "hidden";
document.images["big_image"].src = name;

return false;

}
</script>
</head>
<body>
<div id="thumbs">
<h3>Solar System:</h3>
<script type="text/javascript">
genImage("Apollo17_Earth");
genImage("clem_full_moon");
genImage("giotto_halley");
</script>


</div>

<div id="picture">
<img id="big_image"
onload = "document.getElementById('picture').style.visibili ty =
hideFirstPicture;
hideFirstPicture = 'visible';"
src=
"http://spaceplace.jpl.nasa.gov/en/_images/common/nasa_header/logo_nasa.gif"
>

<p>This is the larger picture</p>
</div>
<div id="footer">
<p>These image are from NASA. See:<br>
http://spaceplace.jpl.nasa.gov/en/ed...s_images.shtml
</p>
</div>
</body>
</html>
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Weird issue, same code, same browser, two different apache servers,very different css bluebaron HTML 3 11-04-2009 07:13 PM
running same script on same data on two different machines -->different result Christopher Brewster Python 5 11-14-2008 08:19 PM
opening thumbnails in IE antradman Computer Information 4 05-22-2008 10:38 PM
window.open() Not Opening in Same Window All The Time k.vanderstarren@gmail.com Javascript 4 04-18-2006 09:15 PM
same code produces different decimal symbol on different computers with same settings ASP General 2 12-29-2003 02:29 PM



Advertisments