8 svar · 178 visningar · startad av LilleSkutt
Halloj!
Jag får inte lager o JS att samarbeta i netscape... I IE flyter ju allt fint, men när man ska göra sin sida NN-kompatibel så ska man väl använda <layer> också? Eller är jag helt lost?
Skulle någon vilja ge ett litet enkelt exempel på en JS-funktion och lite HTML-layers som funkar i både IE och NN?
------------------
---
/* LilleSkutt */
Ingen som har pulat med lager i både IE och NN här, eller? :)
Hur får man ett <div style="visibility:hidden:"> eller <layer style="visibility:hidden;"> att visas korrekt i båda webbläsarna med ett javascript?
Det måste ju vara någon här som har lyckats med detta fenomen ;)
[r]
Koden nedan funkar ju endast i IE, men borde ju gå att kompa med NN...
<script language="JavaScript">
<!--
function trallala(myLayer) {
myLayer.style.visibility='visible';
}
//-->
</script>
<span onMouseOver="javascript:trallala(lagret);">Visa</span>
<div id="lagret" style="visibility:hidden;">
Visat!
</div>
[/r]
------------------
---
/* LilleSkutt */
[Redigerat av LilleSkutt den 31 mar 2001]
<html>
<head>
<script language="JavaScript">
<!--
function trallala(myLayer) {
// Nedan, MSIE.
if(document.all){document.all(myLayer).style.visibility="visible";}
// Nedan, MSIE5+ &NS6.
if(document.getElementById){document.getElementById(myLayer).style.visibility="visible";}
// Nedan, NS4+.
if(document.layers){document.layers[myLayer].visibility="show";}
//För att gömma, MSIE & NS6: "hidden" och NS4+: "show"
}
//-->
</script>
</head>
<body>
<!-- onMouseOver funkar inte på <div> & <span> i NS4+, därav <layer> -->
<layer onMouseOver="javascript:trallala('lagret')">
<span onMouseOver="javascript:trallala('lagret');">
Visa
</span>
</layer>
<br>
<div id="lagret" style="position: absolute; visibility:hidden;">
Innehållet.
</div>
</body>
</html>
------------------
- J-O-H-N-S-E-N -
------------------
Tusen tack! :) :D :D :e :e
En sak bara... I ditt exempel döljer och visar man lagret i NS4 med 'show'?!
Har du skrivit fel, eller är jag bara trött?
[r]
Scriptet funkar inte i Netscape, innehållet i div-arna läggs längst ner i en klump!
[/r]
------------------
---
/* LilleSkutt */
[Redigerat av LilleSkutt den 01 apr 2001]
Felskrivning, det skall givetvis vara "hide" för NS4+. Ännu ett bevis på att alkohol och kod inte hör ihop. :)
Men vad är det som klumpar sig? Har du kopierat den kod jag gav dig rakt av eller har du glömt "position:absolute" i diven?
------------------
- J-O-H-N-S-E-N -
------------------
Jag listade ut att det skulle vara hide :D
Jag koppade koden och configurerade den för mina sidor... Men, som sagt, det funkar inte.
För enkelhetensskull postar jag min kod:
<script language="JavaScript">
<!--
function oppna(myLayer) {
if(document.all) {
document.all(myLayer).style.visibility = "visible";
}
if(document.getElementById) {
document.getElementById(myLayer).style.visibility = "visible";
}
if(document.layers) {
document.layers[myLayer].visibility = "show";
}
}
function steng(myLayer) {
if(document.all) {
document.all(myLayer).style.visibility = "hidden";
}
if(document.getElementById) {
document.getElementById(myLayer).style.visibility = "hidden";
}
if(document.layers) {
document.layers[myLayer].visibility = "show";
}
}
//-->
</script>
<map name="Menu">
<area href="javascript:oppna('alaget')" shape="rect" coords="15, 20, 135, 36" onMouseOver="javascript:oppna('alaget');" onMouseOut="javascript:steng('alaget');">
<area href="javascript:oppna('juniorerna')" shape="rect" coords="15, 48, 135, 64" onMouseOver="javascript:oppna('juniorerna');" onMouseOut="javascript:steng('juniorerna');">
<area href="javascript:oppna('ungdom')" shape="rect" coords="15, 76, 135, 92" onMouseOver="javascript:oppna('ungdom');" onMouseOut="javascript:steng('ungdom');">
</map>
<div id="alaget" style="position:absolute; width:135; height:16; top:20; left:135; background-color:rgb(180,180,180); filter:alpha(opacity=70); border:1px solid black; visibility:hidden;" onMouseOver="javascript:oppna('alaget');" onMouseOut="javascript:steng('alaget');">
<layer onMouseOver="javascript:oppna('alaget');" onMouseOut="javascript:steng('alaget');">
a-laget
</layer>
</div>
<div id="juniorerna" style="position:absolute; width:135; height:16; top:48; left:135; background-color:rgb(180,180,180); filter:alpha(opacity=70); border:1px solid black; visibility:hidden;" onMouseOver="javascript:oppna('juniorerna');" onMouseOut="javascript:steng('juniorerna');">
<layer onMouseOver="javascript:oppna('juniorerna');" onMouseOut="javascript:steng('juniorerna');">
juniorerna
</layer>
</div>
<div id="ungdom" style="position:absolute; width:135; height:16; top:76; left:135; background-color:rgb(180,180,180); filter:alpha(opacity=70); border:1px solid black; visibility:hidden;" onMouseOver="javascript:oppna('ungdom');" onMouseOut="javascript:steng('ungdom');">
<layer onMouseOver="javascript:oppna('ungdom');" onMouseOut="javascript:steng('ungdom');">
ungdom
</layer>
</div>
Som du visade har jag ju gjort, med en skillnad... Jag använder mig av imagesmaps. Kan det vara problemet?
------------------
---
/* LilleSkutt */
Varför köra onMouseOver på <layer> och <div> när du har en imagemap som sköter detta?
Dessutom är anledningen till hopklumpningen inte javascriptet utan stylen på dina lager.
NN stöder bla inte alpha-filter.
kolla på nedanstående kod, den funkar garanterat. (sen får du se över din css i något annat forum).
<script language="JavaScript">
<!--
function oppna(myLayer) {
if(document.all){document.all(myLayer).style.visibility="visible";}
if(document.getElementById){document.getElementById(myLayer).style.visibility="visible";}
if(document.layers){document.layers[myLayer].visibility="show";}
}
function steng(myLayer) {
if(document.all){document.all(myLayer).style.visibility="hidden";}
if(document.getElementById){document.getElementById(myLayer).style.visibility="hidden";}
if(document.layers){document.layers[myLayer].visibility="hide";}
}
//-->
</script>
<map name="Menu">
<area href="javascript:oppna('alaget')" shape="rect" coords="15, 20, 135, 36" onMouseOver="javascript:oppna('alaget');" onMouseOut="javascript:steng('alaget');">
<area href="javascript:oppna('juniorerna')" shape="rect" coords="15, 48, 135, 64" onMouseOver="javascript:oppna('juniorerna');" onMouseOut="javascript:steng('juniorerna');">
<area href="javascript:oppna('ungdom')" shape="rect" coords="15, 76, 135, 92" onMouseOver="javascript:oppna('ungdom');" onMouseOut="javascript:steng('ungdom');">
</map>
<div id="alaget" style="position:absolute; width:135; height:16; top:20; left:135; background-color:rgb(180,180,180); border:1px solid black; visibility:hidden;">
a-laget
</div>
<div id="juniorerna" style="position:absolute; width:135; height:16; top:48; left:135; background-color:rgb(180,180,180); border:1px solid black; visibility:hidden;">
juniorerna
</div>
<div id="ungdom" style="position:absolute; width:135; height:16; top:76; left:135; background-color:rgb(180,180,180); border:1px solid black; visibility:hidden;">
ungdom
</div>
------------------
- J-O-H-N-S-E-N -
------------------
[Redigerat av Johnsen den 02 apr 2001]
Okey, ska prova din kod... Men kan det verkligen bero på CSSen? Om en browser inte känner igen ett attribut har jag för mig att den bara ignorerar detta, och inte fuggar upp hela koden, right?
[r]
Angående onMouseOver på <layer> och <div> är för att i lagren ska det ligga länkar, och när man sen ska klicka på en länk försvinner lagret när man tar bort musen från bilden. Då behövs en onMouseOver i lagret, så att det stannar kvar :)
[/r]
------------------
---
/* LilleSkutt */
[Redigerat av LilleSkutt den 02 apr 2001]
här har du en annan variant som täcker IE4, 5, 5.5 och NS4+ och NS6 och Opera 5... (inklusive nästlade lager i NS4)
I <head>...
<SCRIPT LANGUAGE="Javascript">
<!--//
if(document.layers){
location.reload();
}
}
function getObj(name, nest) {
if (document.getElementById)
return document.getElementById(name).style;
else if (document.all)
return document.all[name].style;
else if (document.layers)
if (nest != ''){
return eval('document.'+nest+'.document.layers["'+name+'"]');
}else{
return document.layers[name];
}
}
function showLayer(layerName, nest){
var x = getObj(layerName, nest);
x.visibility = "visible";
}
function hideLayer(layerName, nest){
var x = getObj(layerName, nest);
x.visibility = "hidden";
}
//-->
</SCRIPT>
det lager du gömmer/visar...
div id="lagerX" style="position:absolute; left:100px; top:100px; width:200px; height:100px; z-index:1; visibility: hidden"> Massa text här... </div>
Kalla på det så här:
i <body>...
<a href="javascript:showLayer('lagerX','');>klicketiklick_visa</a>
<a href="javascript:hideLayer('lagerX,'');>klicketiklick_göm</a>
I '' i funktionsanropen kan du skicka med lagernamnet som omsluter det lager du vill påverka om du har nästlade lager (NS fix).
du kan även kika på http://www.dmsproject.com/newcv där jag använder den här principen till lite annat också.
Lycka till/Dan
------------------
Freedom without discipline is chaos. Discipline without freedom is tyranny.
DmSProject
[Redigerat av DmS den 03 apr 2001]