[GastForen Programmierung/Entwicklung JavaScript DHTML kompatibel mit | Netscape und Explorer | Layers und div

  • Suche
  • Hilfe
  • Lesezeichen
  • Benutzerliste
Themen
Beiträge
Moderatoren
Letzter Beitrag

DHTML kompatibel mit | Netscape und Explorer | Layers und div

Anonym
Beiträge gesamt: 22827

19. Sep 2003, 23:30
Beitrag # 1 von 2
Bewertung:
(567 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo

Mein script sollte zuerst einmal den Browser zwischen Netscape und Explorer unterscheiden,
danach sollter er bei OnMouseOver über dem ImageMap eine Ebene mit einem Text einblenden
und diesen bei OnMouseOut wieder ausblenden.
Bei OnMouseOver wird zusätzlich ein festgelegte Statustext eingeblendet.

Nun mein Problem:

Ich habe je eine Netscape Version und eine Explorer Version im Dreamweaver 4 erstellt.

Nun will ich die Versionen zusammenführen.
Doch leider weiss ich nicht, wie die funktionen aufgerufen werden, damit der gewünschte dhtml effekt entsteht.

Ich komme nicht mehr weiter, wer kann mir da weiterhelfen?
Gruss Renate

<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="JavaScript">
if (document.layers) {
ns = 1; ie = 0;
} else {
ns = 0; ie = 1;
}
function init() {
if (ns) ebene = document.FlugplatzBern;
if (ie) ebene = FlugplatzBern.style;
}

function zeigen(ebene) {
if (ns) ebene.visibility = "show";
if (ie) ebene.visibility = "visible";
} function verbergen(ebene) {
if (ns) ebene.visibility = "hide";
if (ie) ebene.visibility = "hidden";
}
</script>

<body onLoad>

map name="Map">
<area shape="circle" coords="139,91,12" href="grenchen.html" target="_self">
<area shape="circle" coords="146,132,12" href="#">
</map>
</body>
</html>

//////////////// ie Version /////////////////////////////////////////////////////////

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
<!--
<!--
// -->

function MM_findObj(n, d) { //v4.0
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 && document.getElementById) x=document.getElementById(n); return x;
}

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

function MM_displayStatusMsg(msgStr) { //v1.0
status=msgStr;
document.MM_returnValue = true;
}
//-->
</script>
</head>

<body bgcolor="#FFFFFF" text="#000000">
<div id="Bern" style="position:absolute; visibility:hidden; width:138px; height:32px; background-color:#006600; layer-background-color:#006600; border:1px none #000000; z-index:1; left: 40px; top: 10px">
<center>
<font color="#FFFF33" size="2" face="Verdana, Arial, Helvetica, sans-serif">Bern
</font>
</center>
</div>
<div id="Grenchen" style="position:absolute; visibility:hidden; width:138px; height:32px; background-color:#006600; layer-background-color:#006600; border:1px none #000000; z-index:1; left: 40px; top: 10px">
<center>
<font color="#FFFF33" size="2" face="Verdana, Arial, Helvetica, sans-serif">Grenchen</font>
</center>
</div>
<img src="image/schweiz.gif" width="438" height="317" usemap="#Map" border="0">
<map name="Map">
<area shape="circle" coords="146,130,10" href="test.html" target="_self" onMouseOver="MM_showHideLayers('Bern','','show');MM_displayStatusMsg('Bern');return document.MM_returnValue" onMouseOut="MM_showHideLayers('Bern','','hide')">
<area shape="circle" coords="138,90,10" href="test.html" target="_self" onMouseOver="MM_showHideLayers('Grenchen','','show');MM_displayStatusMsg('Grenchen');return document.MM_returnValue" onMouseOut="MM_showHideLayers('Grenchen','','hide')">
</map>
</body>
</html>

//////////////////Netscape Version///////////////////////////////////////////////////////////////

<html>
<head>
<title>Test nn</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
<!--
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
// -->

function MM_findObj(n, d) { //v4.0
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 && document.getElementById) x=document.getElementById(n); return x;
}

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

function MM_displayStatusMsg(msgStr) { //v1.0
status=msgStr;
document.MM_returnValue = true;
}
//-->
</script>
<body bgcolor="#FFFFFF" text="#000000">
<layer id="Grenchen" visibility="hide" width="138" height="32" bgcolor="#006600" z-index="1" left="40" top="10">
<center>
<font face="Verdana, Arial, Helvetica, sans-serif" color="#FFFF33" size="2">Grenchen</font>
</center>
</layer>
<layer id="Bern" visibility="hide" width="138" height="32" bgcolor="#006600" z-index="1" left="40" top="10">
<center>
<font face="Verdana, Arial, Helvetica, sans-serif" color="#FFFF33" size="2">Bern</font>
</center>
</layer>
<img src="image/schweiz.gif" width="438" height="317" border="0" usemap="#Map">
<map name="Map">
<area shape="circle" coords="140,90,11" href="test.html" target="_self" onMouseOver="MM_showHideLayers('Grenchen','','show');MM_displayStatusMsg('Grenchen');return document.MM_returnValue" onMouseOut="MM_showHideLayers('Grenchen','','hide')">
<area shape="circle" coords="144,129,11" href="test.html" target="_self" onMouseOver="MM_showHideLayers('Bern','','show');MM_displayStatusMsg('Bern');return document.MM_returnValue" onMouseOut="MM_showHideLayers('Bern','','hide')">
</map>
</body>
</html>
//////////////////////////////////////////////////////////////////////
X

DHTML kompatibel mit | Netscape und Explorer | Layers und div

SabineP
Beiträge gesamt: 7586

20. Sep 2003, 10:43
Beitrag # 2 von 2
Beitrag ID: #51535
Bewertung:
(567 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Renate,

http://sperner.50free.net/forum/einaus.txt

Ich habe Dir mal einen Code bereitgestellt, der in allen Browsern funktioniert.
Das Javascript prüft am Anfang welche Funktionen der jeweilige Browser verstehen kann.

Gruß Sabine


als Antwort auf: [#51511]
(Dieser Beitrag wurde von SabineP am 3. Feb 2004, 14:16 geändert)