Fortsat: Billedet skal åbne i en celle

target="_blank"

<a href="nyfilmedbilledet.html" target="_blank" onclick="(document.stort_billede.src='billeder/barbara_gif.gif')">Klik Barbara i nyt vindue</a>

<a href="nyfilmedbilledet.html" target="_blank"><img src="billeder/spacer300x300.gif" name="skift_billede" alt="" width="300" height="300" border="0"></a>

Tak for blank target! Det var jo dejlig nemt.
:-)
Det andet kan jeg til gengæld ikke få til at virke.
Idéen skulle være, at man kan linke fra det billede, der kommer frem ved rollover/mouse over.

Jeg har lavet dette rod:

...............
<tr>
<td><a href="babyart_viktor.htm" target="_blank" onMouseOver="(document.skift_billede.src='billeder/viktor_lille72.jpg')">
<img src="billeder/spacer300x300.gif" name="skift_billede" alt="" width="300" height="300" border="0"></a>Rollover Viktor, klik + billedklik Babyart.htm i blank target</a></td>
</tr>
= dur ikke: skulle muliggøre klik på det ny (rollover-)billede med link til .htm-fil
(samt rollover forinden og mulighed for klik på tekstlink også)
................

- og som det fremgår gerne med hele garnituren...
Dvs. fint, hvis linket ligger både på teksten og på rolloverbilledet.
Men især på billedet, hvis begge ikke er muligt.

Først gjorde jeg sådan her:

<tr>
<td><a href="babyart_viktor.htm" target="_blank"></a><img src="billeder/spacer300x300.gif" name="skift_billede" alt="" width="300" height="300" border="0"></a>
Rollover Viktor, klik + billedklik Babyart.htm i blank target</a></td>
</tr>

- - - men de resulterer begge i det samme: At der lægges en ny billedboks ud i cellen (altså 'indeværende' celle, ikke den anden), helt tom med kryds i, og intet link eler aktivitet på noget. Samtidig deaktiveres skiftbillederne på de andre links, der allerede er lavet, - så spacerbilledet/holderen kan åbenbart ikke optræde to steder.

I hvert fald ikke i de her viste fortolkninger af koden. ...

Hvad gør jeg forkert??

Hov, jeg ser lige noget /a-for meget... - eller for lidt ...

Det dur ikke alligevel - jeg kan ikke lige gennemskue de tags....

:-[

(Dvs. selv med passende antal a-tags vil det ikke virke:

<tr>
<td><a href="babyart_viktor.htm" target="_blank"><img src="billeder/spacer300x300.gif" name="skift_billede" alt="" width="300" height="300" border="0">
Rollover Viktor, klik + billedklik Babyart.htm i blank target</a></td>
</tr>
                 
<tr>
<td><a href="babyart_viktor.htm" target="_blank" onMouseOver="(document.skift_billede.src='billeder/viktor_lille72.jpg')">
<img src="billeder/spacer300x300.gif" name="skift_billede" alt="" width="300" height="300" border="0">Rollover Viktor, klik + billedklik Babyart.htm i blank target</a></td>
</tr>   

- - - )

hej filia,

- udover target="_blank" kan du også skrive target="_new"

- du skal ikke skrive ; i mellem de to events da javaen er adskilt som to seperate funktioner, men ellers, vis de ikke var adskilt, har du helt ret i at der skulle være et ; der.

- når du navngiver et objekt med name="navn" skal navnet være unikt for siden, der må altså kun være EN name="skift_billede" på din side, vil du have flere skal du så feks skrive name="skift_billede1" og name="skift_billede2" osv

- du kan ikke NAME et link så derved kan du heller ikke ændre linket med den funktion du bruger
feks
<a href="billede.jpg name="skift_link"><img src="billede.jpg name="skift_billede" /></a>

Det virker ikke.

Og så - jeg er blevet lidt forvirret over hvad du egentlig gerne vil - kan du ikke lige skrive det igen - bare ganske kort :)

Jeg tror det er meningen at ved mouseover på en tekst skal billedet skiftes i en celle, samt href på dette. Ved derefter at klikke på det fremkomne billede, skal der nu åbnes en ny side med billedet. Men som du skriver kan det ikke lade sig gøre.

filia: Hvis det blot er et billede der skal vises, og måske lidt tekst, var det nemmere med en layer frem for et nyt vindue!

akyhne >> tak skal du ha' - layer lyder som det rigtige

filia >> hvor mange billeder drejer det sig om ?

Tak for jeres svar,
- Århus Festuge kom lige i vejen....

Det er rigtigt som akyhne har forstået det.
Tanken var, at selv om der er et tekstlink, der fører dybere, så er det tit en naturlig ting, at linket også ligger på det billede, der knytter sig til teksten/tekstlinket.

Og hvis der nu f.eks. kun var mouseover på teksten - eller på et miniature-billede - som får et større billede frem i en anden celle, så er det jo også nærliggende at klikke på det billede, der er kommet frem, for at komme dybere ind.

Men det anede mig, at det nok ikke er muligt med et link indenfor selve eventen (hvis det er nogenlunde rigtigt udtrykt).
Så der skal nok lægges et eller andet z-index i dybden.

Jeg har engang lavet noget lignende i action script, men det ligger mig yderst fjernt!
Kan I byde på, hvordan sådan nogle lag lægges ind som javascript i html - hvis det f.eks. drejer sig om:
5 forskellige tekstlinks, der er aktive med både et link i dybden (til en anden htm.side) og med mouseover til visning af et billede (ergo 5 i alt) i en anden celle, som også er aktivt i dybden til den samme htm.side.
??

Dvs: En menu/overskrifter med 5 tekstlinks til 5 andre htm.-sider.
Ved mouseover kommer der et billede frem, der repræsenterer linket som en slags forsmag på siden, og ved klik på enten tekstlink eller billede åbner den htm.side, som det drejer sig om.
Altså f.eks. et link, der hedder 'Skildpadder': ved mouseover vises 'skildpadde.jpg' i en celle ved siden af, og ved klik på 'Skildpadder' eller 'skildpadde.jpg' åbnes 'skildpadder.htm'.

Nu er der snart ikke mere blæk i mit tastatur....

Tak for indsatsen hidtil!
:-)

Jeg vil foreslå en lille "popup" i form af en layer ved mouseover, Ved klik skifter du til siden med billedet.

- også en mulighed, men billedet skal være i cellen
- - -
:-)

Jeg kan ikke lige forstå hvorfor du vil have det i en celle.

Men her er et forslag. Lidt gammel kode blandet med lidt af dit:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>



<script language="JavaScript" type="text/JavaScript">
<!--
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_showHideLayers() { //v6.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}

function MM_goToURL() { //v3.0
  var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
  for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
<style type="text/css">
<!--
body {
    background-color: #666666;
}
-->
</style></head>

<body>

<table width="200" height="200" border="1">
<tr>
  <td>
<div id="Layer1" style=" background-color: #FFFF99; layer-background-color: #FFFF99; visibility: hidden;">
  <div align="center">
<p><font color="#000000" size="1" face="Verdana, Arial, Helvetica, sans-serif">Nr1</font></p>
<p><img name="image" src="img1.jpg" width="200" height="200"></p>
</div>
</div>


</td>
</tr>
</table>
<div><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.eksperten.dk" style="text-decoration:none" onMouseOver="document.image.src='logosort.gif'; MM_showHideLayers('Layer1','','show')" onMouseOut="MM_showHideLayers('Layer1','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue"><font color="#FFFFFF" size="1">Hello World </font></a></font></div>
           
<div><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><a href="http://www.eksperten.dk" style="text-decoration:none" onMouseOver="document.image.src='Image.jpg'; MM_showHideLayers('Layer1','','show')" onMouseOut="MM_showHideLayers('Layer1','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue"><font color="#FFFFFF" size="1">Hello World 2</font></a></font></div>


</body>
</html>

Tak for den!!
Jeg har eksperimenteret lidt og må nok se i øjnene, at jeg selv bør få noget styr på syntaksen i alt det her.
Men jeg kan ikke få den til at virke: Billederne (dvs. logosort.gif og Image.jpg er skiftet ud med to andre) skifter fint nok, og tekstlinket virker OK. Dvs. ligesom den her:

<tr>
<td><a href="babyart_viktor.htm" target="_blank" onMouseOver="(document.skift_billede.src='billeder/viktor_lille72.jpg')">
Rollover Viktor, klik Babyart.htm i blank target</a></td>
</tr>

(eller rettere som to af dem).

- - - som jo er lidt kortere.

Dvs. linket på billedet/billederne virker ikke. Jeg tænkte, at det skyldtes MouseOut, for der er jo faktisk ikke noget billede at klikke på. Men selv når billedet bliver stående er der heller ikke link på det.
Jeg tænkte også, at scriptet nok gav mulighed for forskellig tekst til hvert billede, men det har jeg været ude af stand til at bringe på plads (har ellers prøvet lidt af hvert).

Jeg går ud fra, at meningen er, at der er to billeder, der skifter med hinanden, begge med link på. Og at teksten også skifter, men i scriptet er der kun "Nr. 1".
Har prøvet at lave yderligere en div id samt bl.a. indføre et Layer2. Har også undret mig over img1.jpg, for den er 'ligeglad', uanset om den er en gennemsigtig gif, en traktor eller slet ikke findes i min mappe.

- - - -
Men hvis det nu bliver for meget det her, så fik jeg en anden idé undervejs:
Fremfor link på billedet skal billedet bare forsvinde igen ved MouseOut. Elementary - så er der jo ikke noget at klikke på og ergo heller ikke en oplevelse af et dødt link.

Jeg prøvede at lægge en onMouseOut ind med document.skift_billede.src='billeder/spacer.gif, hvor spaceren er en gennemsigtig gif, men det duede ikke.

Det var for at prøve med det forhåndenværende, for jeg tror da, at der er en et andet script, noget med hide måske, til det.

Så det her nedenstående inkl. en MouseOut, der får billedet til at forsvinde igen, vil også være en lykkelig udgang:

<tr>
<td><a href="babyart_viktor.htm" target="_blank" onMouseOver="(document.skift_billede.src='billeder/viktor_lille72.jpg')">
Rollover Viktor, klik Babyart.htm i blank target</a></td>
</tr>

- - - -
?:~)
filia

Her er løsningen på dit oprindelige problem:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>



<script language="JavaScript" type="text/JavaScript">
<!--
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_showHideLayers() { //v6.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}

function MM_goToURL() { //v3.0
  var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
  for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
<style type="text/css">
<!--
body {
    background-color: #666666;
}
-->
</style>

</head>

<body>
Start
<table width="200" height="200" border="1">

<tr>
  <td bgcolor="#33FF33">
 
  <div id="Layer1" style=" visibility: hidden; margin-left:0px;margin-top:0px;width:200px; height:200px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="billeder/viktor_lille72.jpg" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer2" style=" visibility: hidden; margin-left:0px;margin-top:-200px;width:200px; height:200px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="billeder/barbara_gif.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>

  <div id="Layer3" style=" visibility: hidden; margin-left:0px;margin-top:-200px;width:200px; height:200px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="billeder/barbar_gif.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer4" style=" visibility: hidden; margin-left:0px;margin-top:-200px;width:200px; height:200px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="billeder/billede.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer5" style=" visibility: hidden; margin-left:0px;margin-top:-200px;width:200px; height:200px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="billeder/new-3.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer6" style=" visibility: hidden; margin-left:0px;margin-top:-200px;width:200px; height:200px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="billeder/resthead10x10.jpg" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer7" style=" visibility: hidden; margin-left:0px;margin-top:-200px;width:200px; height:200px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="billeder/viktor_lille72.jpg" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
  </td>
</tr>
<tr>
  <td>
  <div><font size="3" face="Verdana, Arial, Helvetica, sans-serif"><a href="#" style="text-decoration:none" onMouseOver="MM_showHideLayers('Layer1','','show'); MM_showHideLayers('Layer2','','hide');MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue"><font color="#FFFFFF" size="1">Hello World 1</font></a></font></div>

<br />
<div><font size="3" face="Verdana, Arial, Helvetica, sans-serif"><a href="#" style="text-decoration:none" onMouseOver="MM_showHideLayers('Layer2','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue"><font color="#FFFFFF" size="1">Hello World 2</font></a></font></div>

<br />
<div><font size="3" face="Verdana, Arial, Helvetica, sans-serif"><a href="#" style="text-decoration:none" onMouseOver="MM_showHideLayers('Layer3','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue"><font color="#FFFFFF" size="1">Hello World 3</font></a></font></div>
<br />

<div><font size="3" face="Verdana, Arial, Helvetica, sans-serif"><a href="#" style="text-decoration:none" onMouseOver="MM_showHideLayers('Layer4','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue"><font color="#FFFFFF" size="1">Hello World 4</font></a></font></div>

<br />

<div><font size="3" face="Verdana, Arial, Helvetica, sans-serif"><a href="#" style="text-decoration:none" onMouseOver="MM_showHideLayers('Layer5','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue"><font color="#FFFFFF" size="1">Hello World 5</font></a></font></div>

<br />

<div><font size="3" face="Verdana, Arial, Helvetica, sans-serif"><a href="#" style="text-decoration:none" onMouseOver="MM_showHideLayers('Layer6','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue"><font color="#FFFFFF" size="1">Hello World 6</font></a></font></div>

<br />

<div><font size="3" face="Verdana, Arial, Helvetica, sans-serif"><a href="#" style="text-decoration:none" onMouseOver="MM_showHideLayers('Layer7','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue"><font color="#FFFFFF" size="1">Hello World 7</font></a></font></div>
  </td>
</tr>
</table>
</body>
</html>

Tak! - - - det prøver jeg lige .....!

Og den der lille MouseOut vil jeg stadigvæk også rigtig gerne låne...

Den sidste du fik 02:55:24 har link på tekst og på image. hvad mangler du mere?

Et stykke wienerbrød ville da være dejligt....

.....
(undskyld joken.... klokken er jo mange....

/vender straks tilbage

Værsgo: document.write("wienerbrød")

Lækkert... tak...skal lige tygge på det, - -
øh, kan den bringes til at fade langsomt ud ?
:-}

- - -
Ellers::

Det virker fint!
Mange tak!! :-))

Der er kun det at sige, at hvert billede rykker sig lidt nedefter, altså øger topmargin sådan at det første billede ligger i toppen af cellen, det sidste i bunden.
Ca. 25 px i alt.
Men -
Det kræver sikkert en halv kilometer kode at få det under kontrol!

Men måske orker du stadig, måske ikke.
I hvert fald tusind tak for indsatsen!!
Og som sagt, skulle du have sådan en/den omtalte MouseOut til overs, så skal jeg nok passe godt på den. ...!

www.gribkarpen.dk:
sender nok snart noget javascript (inkl. MouseOut, måske)
:-))

Forstår ikke lige det med nedrykningen. Dine billeder skal selvfølgelig være lige store, på pixel! Det samme skal alle DIV's, hvis der ikke skal være margen. Prøv med denne: <table cellspacing="0" cellpadding="0" width="200" height="200" border="0">

Cellpadding siger der ikke skal være indermargen i cellen.


Nåh, vent lige lidt! Hvis alle billeder f.eks er 237 pix høje, skal du ændre margin-top:-200px til margin-top:-237px på Layer2-7!!! Det glemte jeg at skrive.
Hvis man sætter den til 0 på alle, ville de ligge under hinanden, og ikke oven på hinanden. Når man rykker nr. 2 sin egen højde op, vil den lægge sig ovenpå 1'eren. 3-7 fortløbende under hinanden. Forstod du det?. Kort sagt: alle layers skal have samme margin-top med omvendt fortegn, som højden der ligger i den pågældende Layer. På  nær den øverste!
Spørg hvis du ikke forstår!
Og nu godnat - gaaab!

Kort sagt: alle layers skal have samme margin-top med omvendt fortegn, som højden der ligger i den pågældende Layer. På  nær den øverste!

...skulle være

Kort sagt: alle layers skal have samme margin-top med omvendt fortegn, som højden på billedet der ligger i den pågældende Layer. På  nær den øverste Layer!

Så den VAR let at rette, ikk'

øøøøøøøøøøøøøøøøøøhhhhhhhhhhhhhhhh,
måske, jeg sover lige på det først..............!

Nu er jeg endt op med det her, som virker fint, men jeg ved ikke hvorfor.
Det, du foreslog til sidst - det er da allerede gjort i det første script?? Altså det med 0 hhv. -200px i topmargin.

Eftersom de der ca. 25px (i alt) derfor også blev ved med at være der, har jeg lagt 4px til/fra i margintoppen, for ganget med 6 er det jo pænt i nærheden af 25px, hvilket også viste sig at passe fuldstændig.
Men hvor de 4px pr. billede kommer fra, har jeg ingen anelse om.

Der blev også ved med at ligge en 4px. (må det jo så være) lysegrå (cccccc) kant under hvert billede, men den er 'væk' nu fordi jeg har ændret #ccc til #fff og td- og bodybaggrund ligeså til hvid, og så kan den jo ikke ses.

Den 8px none-border forstår jeg slet ikke.
Prøvede at fjerne de der styles til layeret helt, altså
background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 8px none #000000"

- men så forsvandt linket på billedet! Mystisk!


Men det hele virker ok sådan her:

<tr>
  <td width="200" height="200" bgcolor="#ffffff">
 
  <div id="Layer1" style=" visibility: show; margin-left:0px;margin-top:0px;width:200px; height:200px; z-index:1; background-color: #ffffff; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="200x200_blaa.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer2" style=" visibility: hidden; margin-left:0px;margin-top:-204px;width:200px; height:200px; z-index:1; background-color: #ffffff; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="200x200_roed.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>

  <div id="Layer3" style=" visibility: hidden; margin-left:0px;margin-top:-204px;width:200px; height:200px; z-index:1; background-color: #ffffff; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="200x200_gul.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer4" style=" visibility: hidden; margin-left:0px;margin-top:-204px;width:200px; height:200px; z-index:1; background-color: #ffffff; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="200x200_brun.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer5" style=" visibility: hidden; margin-left:0px;margin-top:-204px;width:200px; height:200px; z-index:1; background-color: #ffffff; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="200x200_groen.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer6" style=" visibility: hidden; margin-left:0px;margin-top:-204px;width:200px; height:200px; z-index:1; background-color: #ffffff; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="200x200_graa.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
 
  <div id="Layer7" style=" visibility: hidden; margin-left:0px;margin-top:-204px;width:200px; height:200px; z-index:1; background-color: #ffffff; layer-background-color: #CCCCCC; border: 8px none #000000"><a href="http://www.eksperten.dk"><img src="200x200_pink.gif" width="200" height="200" border="0" longdesc="http://www.eksperten.dk" /></a> </div>
  </td>
</tr>

- - - - - - -
tak for din store indsats!
:-)
:-)
:-)

Velbekomme. Det dine billeders nøjagtige højde der bestemmer hvad der skal stå i margin-top. Hvis billederne ikke er lige store (høje), skal den nøjagtige værdi for hver billede stå i den rigtige DIV. Mine testbilleder var nøjagtig 200px høje, derfor den gennemgående værdi i mit forslag.

Nu har jeg ikke det eksempel mere, men var teksten ikke sat til hvid? Så er de "usynlige", når du også laver baggrunden hvid!

Både heigh i Style heigh og img heigh skal være nøjagtige i forhold til billedet.

Mine testbiller er også præcis 200x200px, og cellen er ligeledes 200x200px, ligesom table er 200px bred og så i øvrigt 100% høj.

Så det kan da vel næsten ikke blive mere nøjagtigt?

Mht. fontcolor: no problem, den er selvfølgelig lavet om.

Men jeg loader det lige op, så kan du se resultatet inkl. kilden:
http://www.gribkarpen.dk/beta/javascript/test_javascript_ok.htm

:->

Jeg hentede din kode og billeder, uploadede til mit ene webhotel med margin-top:-200px på 2-7. Det passer perfekt i både IE7 og Firefox. Der er absolut ingen oprykning. Smutter du musen hurtigt op og ned, er det som baggrund der bare skifter farve.

MEN... bå min bærbare med IE6 er den gal. IE6 er heller ikke just kendt for at overholde standarder. IE7 er stadig i release1 udgave, så hvad det endelige resultat vil blive her er ikke til at vide.

Smid evt. linket i et nyt spm, og spørg nørderne, hvad der mest overholder standarderne.

OBS: Når IE7 bliver endelig færdig, bliver det en tvungen Windows Update. De gider nemlig ikke supportere ældre versioner mere.

Ok, det lyder som en forklaring.
Skulle du stadig have lidt tid (??) ville det være fint at vide, hvordan min kode med de -204px opfører sig i IE7 og Firefox, for så skulle man jo tro, at der opstår en uregelmæssighed dér.
I øvrigt var det nedrykning, der skete på billeder 2-7, ikke oprykning.

(Og har i øvrigt selv grejet MouseOuten, den der til at begynde med...!)

- - -
:->

Hjælper gerne. I IE7 og Firefox rykker det netop opad. Modsat af den fejl du havde. Jeg havde tidligt overvejet om man kunne udskifte tallet med en variabel i et JavaScript, men det er ikke så nemt. Hvis man kunne, ville du med en kode kunne checke for brugerens browser, og sætte værdien derefter.

Værsgo. Virker i IE6, IE7 og Firefox. Har også rettet dokumentet til, så det er nemmere at skifte størrelse på billederne.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script language="JavaScript" type="text/JavaScript">
<!--

function SymError()
{
  return true;
}

window.onerror = SymError;

var SymRealWinOpen = window.open;

function SymWinOpen(url, name, attributes)
{
  return (new Object());
}

window.open = SymWinOpen;

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;
}


var SymRealOnLoad;
var SymRealOnUnload;

function SymOnUnload()
{
  window.open = SymWinOpen;
  if(SymRealOnUnload != null)
    SymRealOnUnload();
}

function SymOnLoad()
{
  if(SymRealOnLoad != null)
    SymRealOnLoad();
  window.open = SymRealWinOpen;
  SymRealOnUnload = window.onunload;
  window.onunload = SymOnUnload;
}

SymRealOnLoad = window.onload;
window.onload = SymOnLoad;

function MM_showHideLayers() { //v6.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}

function MM_goToURL() { //v3.0
  var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
  for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
<style type="text/css">
<!--
body {
    background-color: #ffffff;
}

.BilledTD {
    background-color:#33FF33;
    width:000px;
    height:auto;
}

.MyLayer1 {
    z-index:1;
    top: 0;
    visibility:hidden;
    margin-left:0px;
    margin-right:0px;
    margin-top:0px;
    margin-bottom:0px;
    width:200px;
    height:200px;
    overflow:hidden;
}
   
.MyLayer2 {
    z-index:1;
    top: 0;
    visibility:hidden;
    margin-left:0px;
    margin-right:0px;
    margin-top:-200px;
    margin-bottom:0px;
    width:200px;
    height:200px;
    overflow:hidden;
}

.Pics {
    width:200px;
    height:200px;
    border:none;
}
a:link {
    color: #666666;
    text-decoration:none;
    font-size:12px;
}
a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
}
a:visited {
    text-decoration: none;
    color: #999999;
}
a:hover {
    text-decoration: none;
    color: #666666;
}
a:active {
    text-decoration: none;
    color: #666666;
}

-->
</style>
</head>

<body>

<table cellpadding="0">

<tr>
  <td class="BilledTD" height="200px">
 
  <div id="Layer1" class="MyLayer1"><a href="http://www.eksperten.dk"><img class="Pics" src="200x200_blaa.gif" longdesc="http://www.eksperten.dk" alt=""></a> </div>
 
  <div id="Layer2" class="MyLayer2"><a href="http://www.eksperten.dk"><img class="Pics" src="200x200_roed.gif" longdesc="http://www.eksperten.dk" alt=""></a> </div>

  <div id="Layer3" class="MyLayer2"><a href="http://www.eksperten.dk"><img class="Pics" src="200x200_gul.gif" longdesc="http://www.eksperten.dk" alt=""></a> </div>
 
  <div id="Layer4" class="MyLayer2"><a href="http://www.eksperten.dk"><img class="Pics" src="200x200_brun.gif" longdesc="http://www.eksperten.dk" alt=""></a> </div>
 
  <div id="Layer5" class="MyLayer2"><a href="http://www.eksperten.dk"><img class="Pics" src="200x200_groen.gif" longdesc="http://www.eksperten.dk" alt=""></a> </div>
 
  <div id="Layer6" class="MyLayer2"><a href="http://www.eksperten.dk"><img class="Pics" src="200x200_graa.gif" longdesc="http://www.eksperten.dk" alt=""></a> </div>
 
  <div id="Layer7" class="MyLayer2"><a href="http://www.eksperten.dk"><img class="Pics" src="200x200_pink.gif" longdesc="http://www.eksperten.dk" alt=""></a> </div>
  </td>
</tr>
<tr>
  <td>
<br>
<div><a href="#" onMouseOver="MM_showHideLayers('Layer1','','show'); MM_showHideLayers('Layer2','','hide');MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue">Se blå!</a></div>

<br />
<div><a href="#" onMouseOver="MM_showHideLayers('Layer2','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue">Se rød!</a></div>

<br />
<div><a href="#" onMouseOver="MM_showHideLayers('Layer3','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue">Se gul!</a></div>
<br />

<div><a href="#" onMouseOver="MM_showHideLayers('Layer4','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue">Se brun!</a></div>

<br />

<div><a href="#" onMouseOver="MM_showHideLayers('Layer5','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer6','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue">Se grøn!</a></div>

<br />

<div><a href="#" style="text-decoration:none" onMouseOver="MM_showHideLayers('Layer6','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer7','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue">Se grå!</a></div>

<br />

<div><a href="#" onMouseOver="MM_showHideLayers('Layer7','','show'); MM_showHideLayers('Layer1','','hide');MM_showHideLayers('Layer2','','hide'); MM_showHideLayers('Layer3','','hide'); MM_showHideLayers('Layer4','','hide'); MM_showHideLayers('Layer5','','hide'); MM_showHideLayers('Layer6','','hide')"onClick="MM_goToURL('parent','http://www.eksperten.dk');    return document.MM_returnValue;return document.MM_returnValue">Se pink!</a></div>  </td>
</tr>
</table>

</body>
</html>

Det ligner et smadderflot stykke arbejde! Tak!!!

Jeg vender snarest tilbage, har rygende travlt lige i øjeblikket - glæder mig til at prøve det.
*:-)))

Hej akyhne, hvis du stadig er her.....??
Jeg kom lige lidt væk fra scriptet der i september, men nu skal jeg videre. Tak for marathonindsatsen og seneste script, det virker fint, ikke mindst kan jeg jo se, at Browsercheck giver fint flueben til det hele, og selv kan jeg også konstatere, at både IE, Mozilla, Netscape og Opera tager pænt imod!

Der er et enkelt tillægs-spørgsmål, men jeg opretter det lige som nyt, da det hele her er blevet lidt 'gammelt'.

:-)

(Det befinder sig her:
http://www.eksperten.dk/spm/763929)

- - -