Rollover

Status
Niet open voor verdere reacties.

Tjmkok

Gebruiker
Lid geworden
26 mrt 2007
Berichten
38
Het blijft toch schijnbaar een moeilijke (?) kwestie maar ook ik heb een vraag over rollover.
Heb in Dreamweaver CS4 een rollover / wisselende afbeelding maken, gemaakt maar de foto die dan 'boven' water moet komen komt er niet. Is dit een bekend probleem?
Als het noodzakelijk is wil ik hem wel ff plaatsen of anders goeie tips.
M.v.g. Theo
 
nooit problemen mogen ervaren..mischien kun je de door DW gerenereerde code eens posten.
 
zo ziet code bij mij uit.............. met afb/film-2005 en een afb/film-2006.

.
<p><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Afbeelding1','','afb/film-2006.png',1)"><img src="afb/film-2005.png" width="157" height="157" border="0" id="Afbeelding1" /></a></p>

script is hetzelfde

anders eens een nieuwe pagina aanmaken , met alleen de rolover .
 
Laatst bewerkt:
Gevonden!!!
Volgens mij blijkt dat je je bestanden in dezelfde dir moet plaatsen als het html bestand.
zie: http://tjmkok.nl/TestRollover.html
Wel zie ik regelmatig dat wanneer je zo'n tekening laat zien dat dan het scherm erachter donker wordt. Nog een tip hoe dit moet?
M.v.g. Theo
 
Inderdaad... bij een nieuwe pagina gaat het perfect.
Aangepast op: http://tjmkok.nl/websites.htm maar werkt dus niet. Volgens mij heeft het iets te maken met de head???
Zou je eens willen kijken hoe ik dit oplossen kan. Overigens waarvoor heb ik eigenlijk het script uit de head voor nodig:
<link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />
<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

Graag je reactie.
M.v.g. Theo
 
Het script in de head zorgt uiteraard voor het wisselen van de afbeeldingen.



Jou code doet het gewoon bij mij in EX 7/8 en FF, ik heb je afbeelding erin gezet en een bijgemaakt , werkt hier perfect, je moet het pad naar de afbeelding(en), eens goed controleren.

ook de afb in de...
<body onload="MM_preloadImages('groot.jpg')">

maak een afb groot.jpg en klein.jpg en sla die met deze code in dezelfde map op , kijken of het werkt!


Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

	<title>U ben op de websites pagina van The Art of Building</title>
	<link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />
	<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
    </script>
</head>

<body onload="MM_preloadImages('groot.jpg')">

<div id="outer">
	<div id="wrapper">
		<div id="header">
			<h1>The Art of Building</h1>
			<p><img src="images/cooltext39203654.gif" alt="" width="110" height="15" /></p>
		</div>
		<div id="nav">
			<div id="head"></div>
			<div id="head-pip"></div>
			<ul>
				<li id="m1"><a href="http://www.tjmkok.nl">Laatste Nieuws / Home</a></li>
				<li id="m2"><a href="gastenboek.htm">Gastenboek</a><a href="http://www.tjmkok.nl"></a></li>
				<li id="m3"><a href="http://www.tjmkok.nl">Tijdelijk</a></li>
				<li id="m4"><a href="http://www.tjmkok.nl">Tijdelijk</a></li>
				<li id="m5"><a href="index.html">Websites</a></li>
				<li id="m6"><a href="contact.htm">Contact Pagina</a><a href="http://www.tjmkok.nl"></a></li>
			</ul>
			<div id="search">
	      <h2>&nbsp;</h2>
				<form action="http://www.tjmkok.nl/">
				</form>
			</div>
		</div>
		<div id="body">
			<div id="body-inner">
				<div id="body-center">
		    <h2 align="center">Onderstaand vind u allerlei linken</h2>
		    <ul class="blank">
		      <p align="center">Hier vind u een aantal websites die met veschillende programma's gemaakt zijn.<br />
	          <a href="http://www.dorpsraadtubbergen.nl" title="Klik om naar de Dorpsraad te gaan" target="_blank"><br />
	          <img src="e05.gif" alt="" width="16" height="9" />Dorpsraad Tubbergen <img src="e05.gif" alt="" width="16" height="9" /></a><a href="http://www.bertgroothuis.nl" title="Klik hier voor Bert Groothuis" target="_blank">Bert Groothuis </a><a href="http://www.dorpsraadtubbergen.nl" title="Klik om naar de Dorpsraad te gaan" target="_blank"><img src="e05.gif" alt="" width="16" height="9" /></a><a href="http://www.kloosteresch.nl" title="Klik hier om door te gaan naar Kloosteresch" target="_blank">Kloosteresch Interieurs </a><a href="http://www.dorpsraadtubbergen.nl" title="Klik om naar de Dorpsraad te gaan" target="_blank"><img src="e05.gif" alt="" width="16" height="9" /></a><a href="http://www.decoterra.eu" title="Hier klikken voor Decoterra" target="_blank">Decoterra Workshops</a></p>
              
              
              
		      <p align="center"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Afbeelding6','','groot.jpg',1)"><img src="klein.jpg" width="125" height="94" border="0" id="Afbeelding6" /></a><br />
</p>
		    </ul></div>
				<div class="clear"></div>
			</div>
			<div id="copyright">
				<div id="copyright-left"><a href="Disclaimer.pdf" target="_blank">Copyright © 2009,www.tjmkok.nl,all right reserved </a></div>
			</div>
			<div class="clear">&nbsp;</div>
		</div>
	</div>
</div>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-1532284-2");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html>
 
Laatst bewerkt:
:shocked:

Je gebruikt 2 dezelfde afbeeldingen !!!!l met het enige verschil dat ze letterlijk een andere afmeting hebben !!!

Wat is hier het nut van ???

de afbeedldingswissel vind bij jou wel plaats , maar je ziet geen verschil omdat ze allebei hetzelfde formaat krijgen. 125 *94 px

vergroot het beeld eens naar 400% , zie je wel wat verschil.



Maak een andere afb.voor b,v groot.jpg of gebruik 2 echt verschillende , zie je wel het verschil !!
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan