PDA

View Full Version : Image Thumbnail Viewer II wont display in DIV



Targetpractice2
03-22-2009, 10:13 AM
1) Script Title: Image Thumbnail Viewer II

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/thumbnail2.htm
3) Describe problem:
Hi Folks,

First post on this forum and my first attempt at using a little Javascript.

Plenty posts about this script but couldnt find anything exactly like this so appologies if its there already.

I copied and pasted the code and tried it two different ways 1) put the script into the header and 2) created a separate JS file. On both occasions the image loads but appears in a different page not in the related DIV.

I am not a JS user at all so again sorry if this is simple.

heres whats on my html page (external CSS ) its just a blank html page to test out the application before moving onto my actual website.

[code]
<head>
<title>Untitled Page</title>




<script language="JavaScript" src="/thumbnailviewer2.js" type="text/javascript" defer> /*note defer something wrong here?*/



//Code on JavaScript


</script>
<link rel="stylesheet" type="text/css" href="StyleSheet.css" media="screen" />




</head>
<body>


<a href= "images/thumnailporch.jpg" rel="enlargeimage::click" rev="loadarea">Thumbnail
</a><br /><br />

<div id="loadarea" >this is loadarea</div>

<h2 />

<div id="loadarea2">
this is load area two</div>
</body>
</html>
[code]

Note on my external css file I have referenced the div ids to loadarea and loadarea2 just to keep it the same as your file and given them a height and width with a background colour, they display and so do the text and thumbnail. Secondly I have changed the el="enlargeimage:: to "click".

The text/thumbnail when clicked is launching the related larger image but not in the DIV. So it appears as though I have not linked correctly the div?

I assume however that ref="loadarea" is the name of the related div?

as I say I dont work with JS so appologies if this is V simp.

TP

jscheuer1
03-22-2009, 11:06 AM
Your post is a little confusing owing to what appear to be a few typos. But assuming that you at least tried the code that you have in the post, that sounds like it should work. But without actually seeing the page, it's impossible to know for sure. Obviously at some point you either did something, and/or neglected to do something that resulted in the script not functioning, as the result you report is what would happen were there no script at all.

About the defer - The defer attribute may be specified as defer="defer" or simply as defer. Though a standard attribute, as far as I know, it is only used by IE, and can be problematical in that browser, especially when other scripts are on the page. When it works though it speeds thing up in IE for this script, so is potentially useful. However, if it causes a problem, it may simply be removed. IE will use a slightly slower but less error prone path to initialization.

Defer probably has nothing to do with the trouble you are having though. If you want more help:

Please post a link to the page on your site that contains the problematic code so we can check it out.

Targetpractice2
03-22-2009, 11:54 AM
thanks for quick reply..

if your refering to typos re href name its actually the file name I used and matches..although typed incorrectly!

there is no website currently as I am just testing it locally.



I also just cut and pasted the code from the site and used it as is. no changes and it did exactly the same thing. i.e. you see images of rocks or earth etc but they do not appear in the div.


clearly I am doing something wrong when referencing the JS file itself even if I put the JS code into the header it does not work so maybe my src ref is wrong?

As you suggest it appears that its not executing JS and only the HTML hence just a href to the file on click.

tks much.

Targetpractice2
03-22-2009, 12:12 PM
Expanding on the src.

If I pasted the JS into the header and just use the default file
[code] src namesrc="thumbnailviewer2.js" [code].

My editor highlights that it cannot find this name.

(note this is just the default not me creating an external JS)

If I create an external JS and then rename the file /thumbnailviewer2.js it DOES recognize the file but doesnt run.

...