Dynamisches Menue

( HTML, PHP, Javascript & Co ... )
Benutzeravatar
Lighty
Beiträge: 8394
Registriert: 24.08.2006, 02:28

Beitrag von Lighty »

... stimmt, Opera kommt nur an die erste Position !
Allerdings hat die Seite auch 38 Fehler ! ;)
LG, Lighty
Doppelwhopper55
Beiträge: 665
Registriert: 02.06.2010, 19:21

Beitrag von Doppelwhopper55 »

Hast du die Validierung drüber geschickt?

Hatte ich auch schon, allerdings geht dann nach Korrekturen gar nichts mehr.
Die größten Probleme traten auf nachdem ich den Code IE fähig gemacht habe.

Nun ja hatte jetzt auch schon länger nichts mehr gemacht, und wie erwähnt, ist es ein Experiment gewesen :wink:

Schönen Gruß
Doppelwhopper



Benutzeravatar
Lighty
Beiträge: 8394
Registriert: 24.08.2006, 02:28

Beitrag von Lighty »

... wie hast du denn IE-korrigiert !?
Dafür gibt es z.B. einen Meta-Tag - der verändert nicht viel !
( aber der IE versteht es dann besser/korrekt )
LG, Lighty
Doppelwhopper55
Beiträge: 665
Registriert: 02.06.2010, 19:21

Beitrag von Doppelwhopper55 »

Hi Lighty,

mit einem Meta-tag ist da meines Erachtens nicht allzuviel aus zurichten. Ab IE7 ist zwar einiges einfacher geworden aber ohne die IE Korrekturen im Quelltext ging gar nichts.

Hab dir der Einfachheit halber den Quelltext hier rein gestampft :wink:

Solltest du einfachere Lösungen haben immer her damit, du weißt ich bin kein Profi und kann nur aus meinen Erfahrungen berichten.

Code: Alles auswählen

<html>
<head></head>
<body>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="description" content="Ein Kessel Buntes">
<meta name="author" content="Doppelwhopper">
<meta name="keywords" content="Doppelwhopper">
<meta name="robots" content="index, follow">


</head>
<style type="text/css">
body {background-image: url(http://file1.npage.de/001306/24/bilder/back000.gif);
}

}
.Stil2 {
	
background-image: url(http://file1.npage.de/001306/24/bilder/info239c.jpg);
background-repeat: repeat-x;
	font-family: "comic sans ms",  Arial, Helvetica, sans-serif;
	font-size: 20px; font-weight:bold;
	color: #AF220D;
	padding-top: 15px;
	padding-bottom: 5px;
	padding-left: 5px;
	padding-right: 5px;	
}
.Stil3 {
	font-family: "comic sans ms", Arial, Helvetica, sans-serif;
	font-size: 16px; 
	color: #FDFDF9;
	padding-top: 10px;
	padding-bottom: 5px;
	padding-left: 5px;
	padding-right: 5px;
}

</style>
<script type="text/javascript">
if(window.navigator.systemLanguage && !window.navigator.language) {
  function hoverIE() {
    var LI = document.getElementById("Navigation").firstChild;
    do {
      if (sucheUL(LI.firstChild)) {
        LI.onmouseover=einblenden; LI.onmouseout=ausblenden;
      }
      LI = LI.nextSibling;
    }
    while(LI);
  }

  function sucheUL(UL) {
    do {
      if(UL) UL = UL.nextSibling;
      if(UL && UL.nodeName == "UL") return UL;
    }
    while(UL);
    return false;
  }

  function einblenden() {
    var UL = sucheUL(this.firstChild);
    UL.style.display = "block"; UL.style.backgroundColor = "silver";
  }
  function ausblenden() {
    sucheUL(this.firstChild).style.display = "none";
  }

  window.onload=hoverIE;
}
</script>



<style type="text/css">
 body {
    font: normal 100.01% Helvetica, Arial, sans-serif;
    color: black; background-color: #4978FC;
  }

  div#Rahmen {
    width: 47.1em;
    padding: 0.8em;
        border: 0px solid black;
    background-image: url(http://file1.npage.de/001306/24/bilder/back000.gif);
  }
  * html div#Rahmen {  /* Korrektur fuer IE 5.x */
    width: 48.7em;
    w\idth: 47.1em;
  }
  div#Rahmen div {
     clear: left;
  }
  ul#Navigation {
    margin: 0; padding: 0;
    text-align: center;
  }

  ul#Navigation li {
    list-style: none;
    float: left;  /* ohne width - nach CSS 2.1 erlaubt */
    position: relative;
    margin: 0.4em; padding: 0;
  }
  * html ul#Navigation li {  /* Korrektur fuer den IE 5 und 6 */
    margin-bottom: -0.4em;
  }
  *:first-child+html ul#Navigation li {  /* Korrektur fuer den IE 7 */
    margin-bottom: -0.1em;
  }

  ul#Navigation li ul {
    margin: 0; padding: 0;
    position: absolute;
    top: 1.6em; left: -0.4em;
    display: none;  /* Unternavigation ausblenden */
  }
  * html ul#Navigation li ul {  /* Korrektur fuer IE 5.x */
    left: -1.5em;
    lef\t: -0.4em;
  }
  *:first-child+html ul#Navigation ul {  /* Workaround fuer den IE 7 */
    background-color:silver; padding-bottom:0.4em;
  }
  ul#Navigation li:hover ul {
    display: block;  /* Unternavigation in modernen Browsern einblenden */
  }
  ul#Navigation li ul li {
    float: none;
    display: block;
    margin-bottom: 0.2em;
  }

  ul#Navigation a, ul#Navigation span {
    display: block;
    width: 6.4em;  /* Breite den in li enthaltenen Elementen zuweisen */
    padding: 0.2em 1em;
    text-decoration: none; font-weight: bold;
    border: 1px solid black;
    border-left-color: white; border-top-color: white;
    color: maroon; background-color: #ccc;
  }
  * html ul#Navigation a, * html ul#Navigation span {
    width: 8.6em;   /* Breite nach altem MS-Boxmodell fuer IE 5.x */
    w\idth: 6.4em;  /* korrekte Breite fuer den IE 6 im standardkompatiblen Modus */
  }
  ul#Navigation a:hover, ul#Navigation span, li a#aktuell {
    border-color: white;
    border-left-color: black; border-top-color: black;
    color: white; background-color: gray;
  }
  li a#aktuell {  /* aktuelle Rubrik kennzeichnen */
    color: maroon; background-color: silver;
  }
  ul#Navigation li ul span {  /* aktuelle Unterseite kennzeichnen */
    background-color: maroon;
  }

 div-info 

{
font-size:16px;color:#BE162B;font-family:Arial;
position:absolute;width:300px;height:250px;
background-color:#efefef;
}
.div1

{
border:3px solid #ff0000;
left:300px;top:150px;
-moz-border-radius:30px;
-khtml-border-radius:30px;
}

.div2

{
border:3px solid #ff0000;
left:300px;top:450px;
-moz-border-radius:30px;
-khtml-border-radius:30px;
}

div-info2 

{
font-size:16px;color:#BE162B;font-family:Arial;
position:absolute;width:150px;height:550px;
background-color:#efefef;
}

.div3

{
border:3px solid #ff0000;
left:800px;top:150px;
-moz-border-radius:30px;
-khtml-border-radius:30px;
}




</style>
</head>

<body bgcolor="#4978FC"> 


<center>
  <div id="Rahmen"><ul id="Navigation">
    <li><a href="http://doppelwhopper.npage.de/willkommen_18273900.html"">Home</a></li>

    <li><a href="#Flohmarkt">Flohmarkt</a>
      <ul>

		<li><a href="http://myworld.ebay.de/doppelwhopper55/" target="_blank">Mein Ebay</a></li>
		<li><a href="	http://doppelwhopper.npage.de/aktuelles_44130573.html">Aktuelles</a></li>
      </ul>
    </li>

    <li><a href="#Hobbys">Hobbys</a>
	<ul>
        <li><a href="http://doppelwhopper.npage.de/computer_44002657.html">Computer</a></li>
        <li><a href="http://doppelwhopper.npage.de/motorraeder_67345464.html">Motorräder</a></li>
		      </ul>
     </li>
    <li><a href="#Politisches">Politisches</a>
	<ul>
        <li><a href="	http://doppelwhopper.npage.de/krankenkassen_40255727.html">Krankenkassen</a></li>
        
      </ul>
     </li>

    <li><a href="#Kontakt">Kontakt</a>
	 <ul>
        <li><a href="http://doppelwhopper.npage.de/impressum_26773186.html">Impressum</a></li>
        <li><a href="http://doppelwhopper.npage.de/guestbook.html">Gästebuch</a></li>
		<li><a href="http://doppelwhopper.npage.de/partner-links_89261889.html">Partner Links</a></li>
        <li><a href="mailto:doppelwhopper55@gmx.de?subject=">Kontakt</a></li>
      </ul>
     </li>
	  </ul><div></div></div></center>
	  </body>
Reich dir mal ein Taschentuch zum Stirn abwischen......lol :grin:


Schönen Gruß
Doppelwhopper
Benutzeravatar
Lighty
Beiträge: 8394
Registriert: 24.08.2006, 02:28

Beitrag von Lighty »

... schau dir mal das an !
http://www.j-remmer.de/DW55/
( sollte valide sein !? )
LG, Lighty
Doppelwhopper55
Beiträge: 665
Registriert: 02.06.2010, 19:21

Beitrag von Doppelwhopper55 »

Hmmm, da staune ich jetzt nicht schlecht, nun kommt Opera auch damit klar.
Okay im IE sind die ausgeklappten Felder zwar immer noch grau hinterlegt aber das ist okay.
Aber dennoch würde ich gern genauer wissen wo der Fehler lag?

LG
Franz
Benutzeravatar
Lighty
Beiträge: 8394
Registriert: 24.08.2006, 02:28

Beitrag von Lighty »

Hauptfehler war der fehlende Doctype - das ist ein "muss" !

Zudem war da noch einiges anderes durcheinander !
( mehrere head, mehrere body )

... vllt. solltest du auch das CSS auslagern !?
( gibt mehr Übersicht )

Das IE-Problem schau ich mir später mal an !
Hast du die Änderung schon online !?
( kannst ja einfach den Quelltext kopieren )
LG, Lighty
Doppelwhopper55
Beiträge: 665
Registriert: 02.06.2010, 19:21

Beitrag von Doppelwhopper55 »

Noch ganz schnell vielen Dank :grin:

Hab den Quelltext kopiert und werd mir das mal im direkten Vergleich im Editor anschauen.
Nein, Online ist der Code noch nicht.

Melde mich jetzt auch mal zum Grillen ab :lol:

LG Franz
Benutzeravatar
Lighty
Beiträge: 8394
Registriert: 24.08.2006, 02:28

Beitrag von Lighty »

... jo, dann GA !
( bei dem Wetter muss ja auch nicht "unbedingt" an Quelltexten schrauben ! :D )
LG, Lighty
Benutzeravatar
Lighty
Beiträge: 8394
Registriert: 24.08.2006, 02:28

Beitrag von Lighty »

... so, ich habe dir das Ganze schon mal ein wenig sortiert !
( heißt, ich habe das *.css mal ausgelagert )

Damit du an die Dateien kommst habe ich die index mal umbenannt !
Link zum Ordner: http://www.j-remmer.de/DW55/
Link zur *.html: http://www.j-remmer.de/DW55/start.html

... die *.css solltest du aber ggf. neu anlegen oder ausmisten !
( da ist vieles doppelt und einiges nicht erlaubt ) ;)
LG, Lighty
Doppelwhopper55
Beiträge: 665
Registriert: 02.06.2010, 19:21

Beitrag von Doppelwhopper55 »

Hallo Jürgen,

ich bin sprachlos das du dir soviel Zeit und Mühe machst.
Werde mir die Änderungen morgen in aller Ruhe mal anschauen und mit deinem Einverständnis übernehmen.

Also das Coden fasziniert mich schon mächtig, leider fehlt mir die Zeit mich diesem komplexen Thema ausreichend zu widmen......so gehts halt Stück für Stück :wink:

LG
Franz

Benutzeravatar
Lighty
Beiträge: 8394
Registriert: 24.08.2006, 02:28

Beitrag von Lighty »

... klar, kannst du so übernehmen ! ;)
Das coden kommt mit der Zeit - je mehr man macht, desto mehr lernt man !
... und wenn ich Zeit habe, helfe ich gerne dabei ! :)
LG, Lighty
Doppelwhopper55
Beiträge: 665
Registriert: 02.06.2010, 19:21

Beitrag von Doppelwhopper55 »

Lighty hat geschrieben:Orginalbeitrag Lesen

... so, ich habe dir das Ganze schon mal ein wenig sortiert !
( heißt, ich habe das *.css mal ausgelagert )

Hmm, sorry wenn ich noch mal nachfrage? Was verstehst du unter ausgelagert? Wohin? Es muss doch für die Darstellung des Menü im Style eingebettet sein. Das ist doch der Punkt das ich eine neue Seite diesem Style zuweise und so gleich mein Menü habe welches ich dann nur einmal um den Link zur neuen Seite erweitern muss.

LG Franz
Benutzeravatar
Lighty
Beiträge: 8394
Registriert: 24.08.2006, 02:28

Beitrag von Lighty »

Moin Franz !

... jo, ist es auch !
Die *.css kannst du eigentlich speichern wo du möchtest - muss nur der Link angepasst werden !
Der Link zur *.css ist im Kopf über den META platziert !
<link rel="stylesheet" type="text/css" href="css_1.css">
LG, Lighty
Doppelwhopper55
Beiträge: 665
Registriert: 02.06.2010, 19:21

Beitrag von Doppelwhopper55 »

Hi Jürgen,

habe das mit dem ausgelagerten CSS versucht geht gar nicht.
... schau dir mal das an !
http://www.j-remmer.de/DW55/
( sollte valide sein !? )
dies habe ich soeben in eine Teststyle gepackt und der Willkommenseite zugewiesen. Interessanterweise erscheint trotzdem "Doppelwhoppers Surf in" obwohl du als Titel ja "Test DW55" gewählt hast.
Online gestellt ist auch das Operaproblem mit der Navigation wieder vorhanden. :???:

Möglicherweise ist dies aber auch npage begründet. Man hat zwar sehr viele codebasierte Gestaltungsmöglichkeit, was da aber im Hintergrund noch abläuft entzieht sich ja dem Nutzer.

Muss ich da auch nochmals forschen :wink:

LG Franz

Antworten

Zurück zu „Webdesign“