foutmelding javascrip lijn negen, gekopieerde code

Status
Niet open voor verdere reacties.
U

uaejeroen

Terugkerende gebruiker
Lid geworden
7 dec 2009
Berichten
1.665
Code: 
// JavaScript Document
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Javascript onmouseover slideshow</title>
<style type="text/css">
.thumb 
{
	width: 80px;
	height: 60px;
}
#scripttable {
	position: absolute;
	background: #eeeeee;
	top: 10px;
	left: 0px;
	display: none;
}
</style>
</head>
<body>
<div id="imagediv" align="center"> <img src="images/foto0.jpg" name="mainimage" width="800" height="600" vspace="5"> </div>
<div id="thumbsdiv" align="center"> <img src="images/foto0.jpg" class="thumb" onMouseOver="javascript:changeimage(0);"> <img src="images/foto1.jpg" class="thumb" onMouseOver="javascript:changeimage(1);"> <img src="images/foto2.jpg" class="thumb" onMouseOver="javascript:changeimage(2);"> <img src="images/foto3.jpg" class="thumb" onMouseOver="javascript:changeimage(3);"> <img src="images/foto4.jpg" class="thumb" onMouseOver="javascript:changeimage(4);"> <img src="images/foto5.jpg" class="thumb" onMouseOver="javascript:changeimage(5);"> <img src="images/foto6.jpg" class="thumb" onMouseOver="javascript:changeimage(6);"> <img src="images/foto7.jpg" class="thumb" onMouseOver="javascript:changeimage(7);"> <img src="images/foto8.jpg" alt="" class="thumb" onMouseOver="javascript:changeimage(8);"> <img src="images/foto9.jpg" alt="" class="thumb" onMouseOver="javascript:changeimage(9);"> <img src="images/foto10.jpg" alt="" class="thumb" onMouseOver="javascript:changeimage(10);"> <img src="images/foto11.jpg" alt="" class="thumb" onMouseOver="javascript:changeimage(11);"> </div>
<div id="likediv" align="center">
	<table width="50%">
		<tr>
			<td align="center" width="25%"><a href="./" title="Index">Index</a></td>
			<td align="center" width="25%"><a href="javascript:void(0);" onMouseDown="javascript:script(1);">Script</a></td>
			<td align="right" width="25%"><iframe src="http://www.facebook.com/widgets/like.php?layout=button_count&amp;show_faces=false&amp;href=http%3A%2F%2Fwww.jemimaja.be%2Fhelped%2Fslideshow_onmouseover.html" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:150px; height:20px;" allowtransparency="true"></iframe></td>
			<td align="center"><a href="../../" title="My website">Website</a></td>
		</tr>
	</table>
</div>
<table id="scripttable" width="800" cellpadding="10">
	<tr>
		<td>&lt;html&gt;<br>
			&lt;head&gt;<br>
			&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=utf-8&quot;&gt;<br>
			&lt;title&gt;Javascript onmouseover slideshow&lt;/title&gt;<br>
			&lt;style type="text/css"&gt;<br>
			#thumb {<br>
			width: 80px;<br>
			height: 60px;<br>
			}<br>
			&lt;/style&gt;<br>
			&lt;script language=&quot;javascript&quot; type=&quot;text/javascript&quot;&gt;<br>
			&lt;!--<br>
			function changeimage(nnum) {<br>
			document.mainimage.src = &quot;images/foto&quot; + nnum + &quot;.jpg&quot;;<br>
			};<br>
			--&gt;<br>
			&lt;/script&gt;<br>
			&lt;/head&gt;<br>
			&lt;body&gt;<br>
			&lt;div id=&quot;imagediv&quot; align=&quot;center&quot;&gt; &lt;img src=&quot;images/foto0.jpg&quot; name=&quot;mainimage&quot; width=&quot;800&quot; height=&quot;600&quot; vspace=&quot;5&quot;&gt; &lt;/div&gt;<br>
			&lt;div id=&quot;thumbsdiv&quot; align=&quot;center&quot;&gt; &lt;img src=&quot;images/foto0.jpg&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(0);&quot;&gt; &lt;img src=&quot;images/foto1.jpg&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(1);&quot;&gt; &lt;img src=&quot;images/foto2.jpg&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(2);&quot;&gt; &lt;img src=&quot;images/foto3.jpg&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(3);&quot;&gt; &lt;img src=&quot;images/foto4.jpg&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(4);&quot;&gt; &lt;img src=&quot;images/foto5.jpg&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(5);&quot;&gt; &lt;img src=&quot;images/foto6.jpg&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(6);&quot;&gt; &lt;img src=&quot;images/foto7.jpg&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(7);&quot;&gt; &lt;img src=&quot;images/foto8.jpg&quot; alt=&quot;&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(8);&quot;&gt; &lt;img src=&quot;images/foto9.jpg&quot; alt=&quot;&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(9);&quot;&gt; &lt;img src=&quot;images/foto10.jpg&quot; alt=&quot;&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(10);&quot;&gt; &lt;img src=&quot;images/foto11.jpg&quot; alt=&quot;&quot; class=&quot;thumb&quot; onMouseOver=&quot;javascript:changeimage(11);&quot;&gt; &lt;/div&gt;<br>
			&lt;body&gt;<br>
			&lt;html&gt; </td>
	</tr>
	<tr>
		<td align="center"><a href="javascript:void(0);" onMouseDown="javascript:script(0);">Close</a></td>
	</tr>
</table>
<script language="javascript" type="text/javascript">
<!--

document.getElementById("scripttable").style.left = (document.all) ? (window.document.body.clientWidth-798)/2 : (window.innerWidth-800)/2;

function changeimage(nnum) {
	document.mainimage.src = "images/foto" + nnum + ".jpg";
};

function script(nnum) {
	document.getElementById("scripttable").style.display = (nnum == 1) ? "block" : "none";
};
-->
</script>
</body>
</html>

width: 80px;
Klik om te vergroten...
hier zit de fout

ik snap er helemaal niks van
op die site waar ik die code vandaan heb werkt die perfect

verder... ik wil deze javascript aanroepen en centreren... hoe krijg ik hem gecentreerd ? gewoon <center> bestand aanroepen </center?
 
Ik draai deze code van je net op m'n eigen server, en ik krijg er geen 1 foutmelding van.. De pagina ziet er ook goed uit qua layout.

javascript centreren is nieuw voor me. :) wat bedoel je daarmee?
 
ehm heb je dit als een .js bestand opgeslagen? Zo ja, dan is dat de fout, dit is namelijk niet allemaal javascript. het grootste deel van dit document bestaat uit HTML, met wat CSS en een beetje javascript.

De <center> tag wordt trouwens al jarenlang afgeraden, niet gebruiken dus.
 
Eerste vraag is natuurlijk: Hoe komt uaejeroen aan de veronderstelde javascript-foutmelding in lijn 9? Met welke test? Of is het een browser-melding: welke browser, welke versie?

=====
rajmv: Ik draai deze code van je net op m'n eigen server, en ik krijg er geen 1 foutmelding van.
Klik om te vergroten...
Dat hangt ervan af waarop je test ;), b.v.:
  • Op het script solo, met JSLint (met opties: "Assume a browser", "Tolerate==and!=", "Tolerate misordered definitions", "Tolerate missing 'use strict' pragma" en "Tolerate messy white space"): 2 Errors.
    Errors: twee keer een ";" na een "}", niet ernstig. Voorlopige conclusie: script zelf vormt geen probleem.

  • Op de hele pagina, Test 1: inclusief het "// JavaScript Document" in de eerste regel, html-validator: 182 Errors.
    NB: dit correspondeert met de foutmelding. Op deze manier staat width: 80px; op regel 9!
    Een javascript-commentaar kan sowieso niet in de html gezet worden; en als eerste regel van een html-pagina mag er nóóit iets anders staan dan het Doctype.

  • Op de hele pagina, Test 2: zonder het "// JavaScript Document" in de eerste regel, html-validator: 11 Errors.
=====
rajmv: De pagina ziet er ook goed uit qua layout.
Klik om te vergroten...
Op het scherm dan, dankzij toegeeflijke browsers (zie html-errors hierboven).

=====
uaejeroen: ik wil deze javascript aanroepen en centreren... hoe krijg ik hem gecentreerd ?
Klik om te vergroten...
Met de huidige html-code (<div id="imagediv" align="center">, enz.) hoeft dat niet: staat al gecentreerd. :)
  • Maar beter is de pagina te centreren met css: body{width:..px; margin:0,auto;} en div{text-align:center;}.
=====
rajmv: javascript centreren is nieuw voor me. :) wat bedoel je daarmee?
Klik om te vergroten...
Wat jeroen met "javascript centreren" bedoelt, weet ik niet. Wel wordt de op de pagina opgenomen script-tekst (de "scripttable", via de link "script" onderaan aan/uit te zetten) gecentreerd ... met javascript:
[JS]document.getElementById("scripttable").style.left = (document.all) ?
(window.document.body.clientWidth-798)/2 : (window.innerWidth-800)/2;[/JS]
Zou mijn methode niet zijn :confused:, maar dit komt als illustratie mee met de voorbeeld-pagina van het script, en zal op de definitieve pagina verwijderd kunnen worden.

=====
Maar eh, helemaal los hiervan: dit script gebruikt geen echte thumbnails, maar neemt daarvoor de grote afbeeldingen en maakt die op maat via css:
Code: 
.thumb 
{
	width: 80px;
	height: 60px;
}
Dat betekent dat voor het tonen van de pagina éérst alle grote afbeeldingen ingeladen moeten worden.
Nadeel: bij veel afbeeldingen en/of afbeeldingen met veel kB's duurt het erg lang voordat de pagina compleet in beeld is.
Ik zou daarom dit hele script niet gebruiken... :rolleyes:

Een alternatief zou bv. kunnen zijn:
En er zijn ook veel soortgelijke scripts in omloop!

Met vriendelijke groet,
CSShunter
 
Laatst bewerkt:
Beste CSS Hunter

Hierbij onsettend bedankt voor uw informatie !!!!

Echt ongeloofelijk hoe duidelijke uitleg u geeft over zaken waar ik amper maar letters inbeeld en niet denk dat doet dat

Html is nog in te beelden voor mij qua table center en dat hele rijtje tags maar javascript kan ik alleen aanpassen als ik bnekende dingen zie kleuren,grootte,en noem maar op !!!

ik heb in der tijd al vele andere scripts gevonden 1 daarvan werkt met een database (php) daar heb ik me ook in verdiept maar hier loop ik vast met CHMOD
Ik weet niet waar ik dat moet instellen

Het zou mogelijk moeten zijn met DW maar als ik zo's tutorial heb loop ik ook vast

weet u misschien hoe ik dit voor elkaar krijg
 
Laatst bewerkt door een moderator:
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan