mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 08.12.2016 17:39 Benutzername: Passwort: Auto-Login

Thema: Frage zum Menu vom 03.10.2005


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Frage zum Menu
Seite: 1, 2, 3  Weiter
Autor Nachricht
duckonline.be
Threadersteller

Dabei seit: 12.11.2003
Ort: Belgien
Alter: 33
Geschlecht: Männlich
Verfasst Mo 03.10.2005 08:15
Titel

Frage zum Menu

Antworten mit Zitat Zum Seitenanfang

Hallo Freaks !

http://www.planeta.se/

kann mir mal jemand sagen wie das Menu gemacht worden ist ?
Wenn ja, gibts eine anleitung um sowas zu basteln ?

Danke
  View user's profile Private Nachricht senden
Njelo

Dabei seit: 18.07.2003
Ort: Leonberg
Alter: 36
Geschlecht: Männlich
Verfasst Mo 03.10.2005 08:19
Titel

Antworten mit Zitat Zum Seitenanfang

CSS für layout/content
Javascript für's "Ausklappen"
  View user's profile Private Nachricht senden
Anzeige
Anzeige
aUDIOfREAK

Dabei seit: 04.04.2002
Ort: Ansbach
Alter: 36
Geschlecht: Männlich
Verfasst Mo 03.10.2005 10:59
Titel

Antworten mit Zitat Zum Seitenanfang

Njelo hat geschrieben:
Javascript für's "Ausklappen"


nein - da is kein javascript im spiel. das ist komplett mit css gelöst.

wenn du dir mal den quellcode der seite anschaust, wirst du folgende zeilen sehen:
Code:

<div id="upper">
<ul>
   <li id="upper_home"><a href="http://www.planeta.se/" title="till framsidan"><span>Hem</span></a></li>
   <li id="upper_sitemap"><a href="http://www.planeta.se/karta" title="till planetas sitemap"><span>Sitemap</span></a></li>
   <li id="upper_search"><a href="http://www.planeta.se/sok" title="s&ouml;k p&aring; planeta.se"><span>S&ouml;k</span></a></li>
</ul>
</div>

das ist im grunde auch schon die ganze navi. im css werden die tags <li> und <ul> dann eben mit den entsprechenden attributen angegeben. in der css-datei ( http://www.planeta.se/scripts/planeta_02.css ) findest du das hier:
Code:
ul {
   list-style: none;
   margin: 0 0 10px 0;
   padding: 0;
}

ul li {
   padding: 0 0 0 15px;
   margin: 0;
   background: transparent url(../img/pil_01.gif) no-repeat 0 60%;
}

ul li.read_more {
   padding: 0 0 0 15px;
   background: transparent url(../img/pil_03.gif) no-repeat 0 70%;
}

ul li.read_more:hover {
   background: transparent url(../img/pil_03.gif) no-repeat 0 70%;
}

ul li:hover {
   background: transparent url(../img/pil_01_hover.gif) no-repeat 0 60%;
}


das war's im grunde auch schon...
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 03.10.2005 11:39
Titel

Antworten mit Zitat Zum Seitenanfang

Schwachsinn, natürlich ist JavaScript im Spiel. Was von dem Code den du hier jetzt gepostet hast sorgt denn bitte für das ausklappen bei onClick?


Gruß
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
aUDIOfREAK

Dabei seit: 04.04.2002
Ort: Ansbach
Alter: 36
Geschlecht: Männlich
Verfasst Mo 03.10.2005 11:45
Titel

Antworten mit Zitat Zum Seitenanfang

m hat geschrieben:
Schwachsinn, natürlich ist JavaScript im Spiel. Was von dem Code den du hier jetzt gepostet hast sorgt denn bitte für das ausklappen bei onClick?


Gruß


sowas geht ganz einfach mit if then abfragen in php... da braucht man definitiv kein javascript. ich hab solche navigationen schon zichfach erstellt.!

sorry - bei dem codeschnipsel hab ich mich vertan. bei der seite ist tatsächlich javascript im spiel. hier der richtige code:
Code:
<ul id="menu">
   <li class="selected"><a tabindex="1" href="http://www.planeta.se/" class="menuD" id="mm0" title="tillbaka till framsidan">Hem</a></li>
   <li><a tabindex="2" href="#" class="menuD" id="mm1" onclick="resetMenu('m1'); return false;" onkeypress="resetMenu('m1'); return false;" title="information om planeta">Planeta</a>
      <ol id="m1" class="submenu">
         <li><a href="http://www.planeta.se/information/om_planeta.htm" title="information om n&auml;tverket planeta">om planeta</a></li>
         <li><a href="http://www.planeta.se/scener" title="scener inom n&auml;tverket planeta">scener</a></li>
         <li><a href="http://www.planeta.se/arrangorer" title="arrang&ouml;rer inom n&auml;tverket planeta">arrang&ouml;rer &amp; akt&ouml;rer</a></li>
         <li><a href="http://www.planeta.se/kontakt" title="kontakta oss">kontakt</a></li>
         <li><a href="http://www.planeta.se/information/omhemsidan.htm" title="information om hemsidan">om hemsidan</a></li>
         <li><a href="http://www.planeta.se/press" title="planetas press sektion">press</a></li>
      </ol>
   </li>
   <li><a tabindex="3" href="#" class="menuD" id="mm2" onclick="resetMenu('m2'); return false;" onkeypress="resetMenu('m2'); return false;" title="Folk och v&auml;rldsmusik">Folk- &amp; v&auml;rldsmusik</a>
      <ol id="m2" class="submenu">
         <li><a href="http://www.planeta.se/artiklar" title="L&auml;s och kommentera artiklar">lira</a></li>
         <li><a href="http://www.planeta.se/lankar" title="Bl&auml;ddra i v&aring;rt l&auml;nkarkiv">l&auml;nkar</a></li>
      </ol>
   </li>
   <li><a tabindex="4" href="http://www.planeta.se/kalender" class="menuD" id="mm3" title="se vad som h&auml;nder eller bl&auml;ddra i arkivet">Kalender</a></li>
   <li><a tabindex="5" href="http://www.planeta.se/information/festival.htm" class="menuD" id="mm4" title="information om planetas festival">Festival</a></li>
   <li><a tabindex="6" href="http://www.planeta.se/sok" class="menuD" id="mm5" title="s&ouml;k i hemsidan">S&ouml;k</a></li>
   <li><a tabindex="7" href="http://www.planeta.se/information/english.htm" class="menuD" id="mm6" title="information in English">In English</a></li>
</ul>


aber wie gesagt - mit ner einfachen php-abfrage geht das auch komplett ohne javascript (was ich persönlich die elegantere lösung finde!)
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
webdeveloper

Dabei seit: 25.05.2003
Ort: SG
Alter: 32
Geschlecht: Männlich
Verfasst Mo 03.10.2005 12:21
Titel

Antworten mit Zitat Zum Seitenanfang

aUDIOfREAK hat geschrieben:
aber wie gesagt - mit ner einfachen php-abfrage geht das auch komplett ohne javascript (was ich persönlich die elegantere lösung finde!)

an sich hast du recht. aber: den vorgang if/else, den du beschreibst, setzt ein neuladen der seite voraus. und wenn du auf den 2. menüpunkt klickst, findet kein neu laden statt (oder ist meine 6mbit leitung so schnell??)

folgedessen kann es also nicht eine php-abfrage sein *zwinker*
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
aUDIOfREAK

Dabei seit: 04.04.2002
Ort: Ansbach
Alter: 36
Geschlecht: Männlich
Verfasst Mo 03.10.2005 12:29
Titel

Antworten mit Zitat Zum Seitenanfang

webdeveloper hat geschrieben:
aUDIOfREAK hat geschrieben:
aber wie gesagt - mit ner einfachen php-abfrage geht das auch komplett ohne javascript (was ich persönlich die elegantere lösung finde!)

an sich hast du recht. aber: den vorgang if/else, den du beschreibst, setzt ein neuladen der seite voraus. und wenn du auf den 2. menüpunkt klickst, findet kein neu laden statt (oder ist meine 6mbit leitung so schnell??)

folgedessen kann es also nicht eine php-abfrage sein *zwinker*


ja wie ich oben schon gesagt hab isses bei diesem beispiel javascript. ich persönlich finde aber die methode via php besser. vor allem, weil dabei (im gegensatz zu der javascript version von hier) "anständige" und vor allem suchmaschinenlesbare verlinkungen verwendet werden können. zudem ist javascript auf mittlerweile doch einigen systemen deaktiviert. mobile geräte wie pda oder handys können javascript auch nicht so wirklich interpretieren und damit wird für dieses klientel die seite unbenutzbar und somit wertlos.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Account gelöscht


Ort: -
Alter: -
Verfasst Mo 03.10.2005 12:40
Titel

Antworten mit Zitat Zum Seitenanfang

Is ja eigentlich egal wie es gemacht wird. Solange das JS schön
von der Quelle getrennt wird, gibts da eigentlich auch keine
Probleme.

Hier ist sowas ähnliches (die Seite sollte eigentlich hier irgendwo
in nem Banner auftauchen mit nem großen Pfeil dran):

http://www.alistapart.com/d/complexdynamiclists/finder.html


///
Wobei ich sagen muss, dass ich die serverseitige Bereitstellung von versch. Quellen für versch. Ausgabemedien auch noch am günstigsten halte.


Zuletzt bearbeitet von am Mo 03.10.2005 12:41, insgesamt 1-mal bearbeitet
 
 
Ähnliche Themen rollover im js menu
javascript menu II
Smart MENU
Collapsible menu
JS-Dropdown Menu
CSS Menu
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2, 3  Weiter
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.