mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Di 06.12.2016 13:20 Benutzername: Passwort: Auto-Login

Thema: falsche Darstellung der Navigation vom 15.05.2006

Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> falsche Darstellung der Navigation
Autor Nachricht
Unpredictable
Threadersteller

Dabei seit: 11.05.2006
Ort: Siegen
Alter: 30
Geschlecht: Männlich
Verfasst Mo 15.05.2006 10:54
Titel

falsche Darstellung der Navigation

Antworten mit Zitat Zum Seitenanfang

Hallo leute!

Ich hab ein kleines Problem, ich hab mir eine Navigation mit expanding menü programmiert.Wenn ich die in Dreamweaver 8 anzeigen lasse, ist alles okay, nur wenn ich dann die ganze Sache in Firefox oder IE öffne, stellt er in Firefox alles komplett falsch dar und bei IE muss ich erst pop-up fenster zu lassen. Wie kann ich erreichen, dass das alles richtig dargestellt wird?

Code:

<html>
<head>
<script type="text/javascript">

if(!window.Node){
   var Node = {ELEMENT_NODE : 1, TEXT_NODE : 3};
}
function checkNode(node, filter){
   return (filter == null || node.nodeType == Node[filter] || node.nodeName.toUpperCase() == filter.toUpperCase());
}
function getChildren(node, filter){
   var result = new Array();
   var children = node.childNodes;
   for(var i = 0; i < children.length; i++){
      if(checkNode(children[i], filter)) result[result.length] = children[i];
   }
   return result;
}
function getChildrenByElement(node){
   return getChildren(node, "ELEMENT_NODE");
}
function getFirstChild(node, filter){
   var child;
   var children = node.childNodes;
   for(var i = 0; i < children.length; i++){
      child = children[i];
      if(checkNode(child, filter)) return child;
   }
   return null;
}
function getFirstChildByText(node){
   return getFirstChild(node, "TEXT_NODE");
}
function getNextSibling(node, filter){
   for(var sibling = node.nextSibling; sibling != null; sibling = sibling.nextSibling){
      if(checkNode(sibling, filter)) return sibling;
   }
   return null;
}
function getNextSiblingByElement(node){
   return getNextSibling(node, "ELEMENT_NODE");
}


var activeMenu = null;

function showMenu(){
   if(activeMenu){
      activeMenu.className = "";
      getNextSiblingByElement(activeMenu).style.display = "none";
   }
   if(this == activeMenu){
      activeMenu = null;
   }else{
      this.className = "active";
      getNextSiblingByElement(this).style.display = "block";
      activeMenu = this;
   }
   return false;
}
function initMenu(){
   var menus, menu, text, a, i;
   menus = getChildrenByElement(document.getElementById("menu"));
   for(i = 0; i < menus.length; i++){
      menu = menus[i];
      text = getFirstChildByText(menu);
      a = document.createElement("a");
      menu.replaceChild(a, text);
      a.appendChild(text);
      a.href = "#";
      a.onclick = showMenu;
      a.onfocus = function(){this.blur()};
   }
}

if(document.createElement) window.onload = initMenu;

</script>
<style type="text/css">
<!--
#navi
{
float: left;
width: 150px;
height: 300px;
background-color: #cc0000;
padding: 0px;
margin: 0px;

background-repeat: no-repeat;
background-position: bottom;
}

#navi ul
{
list-style: none;
margin: 0px;
padding: 0px;
}

#navi ul li
{
margin: 0px;
}

#navi ul li a
{
display: block;
padding-top: 6px;
padding-bottom: 6px;
padding-left: 13px;
text-decoration: none;
font-size : 8pt;
font-family : Tahoma;
width: 177px;
font-weight: bold;
}

html>body #navi ul li a
{
width: auto;
}

li.active
{
background-color: #000066;
}

#######################################################

ul#menu
{
list-style-type: none;
margin: 0;
padding: 0;
}

ul#menu ol
{
display: none;
text-align: left;
list-style-type: none;
margin: 0;
}

ul#menu li,
ul#menu a
{
font-family: verdana, sans-serif;
font-size: 11px;
color: #FFFFFF
}

ul#menu li
{
border-bottom: none;
line-height: 15px;
}

ul#menu li.active
{
border-bottom: none;
line-height: 15px;
background-color: #000066;
}

ul#menu ol li:before
{
content: "- ";
}

ul#menu a
{
text-decoration: none;
outline: none;
}

ul#menu a.sub
{
background-color: #DBE9F3;
color: #000066;
}

ul#menu a:hover
{
background-color: #000066;
color: #FFFFFF;
}

ul#menu a:link
{
background-color: #fffff;
color: #FFFFFF;
}

ul#menu a.active
{
background-color: #000066;
color: #FFFFFF;
}
-->
</style>
</head>
<body>

<div id="navi">
<ul id="menu">
<li><br />Home
<ol>
   <li><a href="index.html" class="sub"><p class="hide">News</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Presse</p></a></li>
</ol>
</li>
<li style="display:block;"><br />Verein
<ol>
   <li><a href="index.html" class="sub"><p class="hide">Geschichte</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Vorstand</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Termine</p></a></li>
</ol>
</li>
<li><br />Angebote
<ol>
   <li><a href="index.html" class="sub"><p class="hide">Babyschwimmen</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Anfängerschwimmkurs</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Erwachsenenschwimmkurs</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Nachwuchsgruppen</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Breitensport</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Aqua - Fitness</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Leistungssport</p></a></li>
</ol>
</li>
<li><br />Seelbacher Weiher
<ol>
   <li><a href="index.html" class="sub"><p class="hide">Geschichte</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Preise</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Presse</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Bilder</p></a></li>
</ol>
</li>
<li><br />Kontakt
<ol>
   <li><a href="index.html" class="sub"><p class="hide">Kontakt</p></a></li>
   <li><a href="index.html" class="sub"><p class="hide">Impressum</p></a></li>

</ol>
</li>
<br /><a href="downloads.html">Downloads</a>

<br /><a href="links.html">Links</a>
</ul>
</div>
</body>
</html>
  View user's profile Private Nachricht senden
Ähnliche Themen falsche Darstellung im Internet Explorer
Tabelle mit 100% im IE falsche Darstellung
[Dreamweaver] Falsche Darstellung der Homepage im Explorer
Falsche Darstellung im Internet-Explorer - Ich verzweifle...
[ERLEDIGT] [PHP] Falsche Darstellung von String
Slimbox unter Firefox - falsche Darstellung des Balkens
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.