Archiv verlassen und diese Seite im Standarddesign anzeigen : Help Mit Css
Ich möchte gerne auf einer Webseite ein menü machen, wo beim Berühren Unterfelder aufklappen. Ein Kollege von mir meinte, dass ich es mit CSS machen könnte aber ich weiß nicht wie ich anfangen soll weil ich mich noch nie so richtig mit CSS und Dreamweaver gearbeitet habe. Wisst ihr was ich zuerst machen sollte ? :confused:
Biosfear
24.08.2005, 12:05
Am besten liest und arbeitest du zuerst einmal folgende Tutorials (http://de.selfhtml.org/css/index.htm) durch. Da ist so ziemlich alles an Grundlagen erklärt, was du zu CSS brauchen müsstest. Das Tutorial bezieht sich nicht nur auf das Layout von Navigationsleisten. Dort solltest du einfach einmal einen Über- und vorallem Einblick in CSS erhalten. Ich rate dir zuerst die Grundlagen etwas anzuschauen, um dich mit CSS vertraut zu machen (ausserdem ist es nebenbei ja auch nicht sonderlich schwer zu lernen).
Das was du speziell in deinem Post ansprichst ist ebenfalls auf der selben Seite als Tutorial verfügbar. Nämlich CSS-basierte-Layouts (http://de.selfhtml.org/css/layouts/index.htm). Dort wird näher auf ein Layout und Design, das praktisch komplett auf CSS basiert eingegangen.
Um es dir noch ein bisschen einfacher zu machen:
Hier (http://de.selfhtml.org/css/layouts/navigationsleisten.htm#modern) findest du genau das CSS-Layout, das du suchst. Das kannst du natürlich noch nach belieben modifizieren und mit anderen Farben unterlegen etc. Dazu nimmst du einfach am besten die von mir obengenannten Links zu den Tutorials zur Hilfe :)
Viel Spass
Dieser Thread gehoehrt allerdings ins Web-Entwicklungs-Forum ...
Ich verschieb ihn gleich mal ...
this->move(Forum->WebDev);
<a href="#" onmouseover="document.getElementbyId('nav1').style.display='block';" onmouseout="document.getElementbyId('nav1').style.display='none';">Menü 1 aufklappen</a>
<div style="display:none">
Menupunkt 1<br />
Menüpunkt 2<br />
</div>
So in etwa müsste es klappen.
Milchbox
24.08.2005, 15:04
Das Tut. von Selfhtml ist sehr empfehlenswert ( für anfänger :D ).
Es hat mir bei meinem ersten menu sehr geholfen.Ich hab hier noch eine Liste mit denn wichtigsten befehlen von css runtergeladen und schwupp die wupp war das menu fertsch :D
<a href="#" onmouseover="document.getElementbyId('nav1').style.display='block';" onmouseout="document.getElementbyId('nav1').style.display='none';">Menü 1 aufklappen</a>
<div style="display:none">
Menupunkt 1<br />
Menüpunkt 2<br />
</div>
So in etwa müsste es klappen.
Das ist aber weniger CSS als Javascript. Das geht auch mit purem CSS.
<!DOCTYPE ...>
<html>
<head>
<title>Seitentitel</title>
<style type="text/css">
<!--
body { ... }
/* Tolles Aufklappmenü */
a.openmenu div { display: none; }
a.openmenu:hover div { display: block; height: 240px; width: 180px; }
-->
</style>
</head>
<body>
<a class="openmenu" href="#top">Menu anzeigen!<br /><br />
<div>Hier der Inhalt des zu öffnenden Menüs</div></a>
</body>
</html>
Nachteil allerdings auch hier, dass das Menü evtl. sofort wieder verschwindet, wenn man vom Link etwas nach unten geht ... auch wenn das Menü selbst ja im Grunde auch noch zum Link gehört. Naja, musst du halt wissen, ob du das wirklich brauchst ^^
Ich würd nicht empfehlen, das Menü per CSS zu machen, aus mehreren Gründen:
Der IE unterstützt es net und zeigt dann gar nix an => Seite ist mit dem IE völlig unbrauchbar
CSS ist dafür eigentlich nicht gedacht
Es gibt keine Möglichkeit ne Verzögerung oder sowas einzubauen
Die Reihenfolge im HTML-Code ist zwingend
Milchbox
24.08.2005, 17:59
LOL aus welchem grund sollte ein css menü mit dem IE nicht klappen? :D
Ich habs eben ausprobiert an meine homepage, da hab ich auch ein css menu und es klappt :eek:
Und was sagste jetzt :rolleyes:
dead_orc
24.08.2005, 18:41
Entweder unmöglich oder sehr umständlich gecodet, da der IE schlicht weg dumm ist und die Pseudoklasse :hover nur für den a-Tag unterstützt. Demnach müsste das komplette Untermenü in einem a-Tag gelagert sein, was zwangsläufig unvalide wird, da es aus mehrzeiligen Blockelementen besteht. Bestes Beispiel für ein solches Menü, das im IE nicht funktioniert (http://de.selfhtml.org/css/layouts/anzeige/nav_modern.htm)
Oder es ist mit JS...
Bei dem Menü mit Java hat selbst der neue Internetexplorer bei WinXP Probleme und für Flash hab ich kein Geld übrig. Zumindest habe ich im Tutorial das passende gefunden und das läuft mit dem IE wie geschmiert. Dann ist aber noch die Frage mit weiteren Untermenüs.
Bei dem Menü mit Java hat selbst der neue Internetexplorer bei WinXP Probleme
Inwiefern?
Er zeigt das menü überhaupt nicht an !!! :\
Falls du dich jetzt auf meinen Vorschlag beziehst, ich hab den Code nicht getestet, daher kann er auch falsch sein. Vom Prinzip her funktioniert es aber genau so.
Um noch weiter auszuholen soll es ein Vertikales dynamisches Menü sein wie diese Seite sie hat: Oberer Bereich der Seite (http://www.wdc.com/de/index.asp?Language=de)
Guck dir doch das JS von der Seite an o_O
http://www.wdc.com/de/wdscripts/fw_menu.js
ich glaube das ist das
Oder auf www.justgamers.de gibts das gleiche, steckt glaub ich auch das gleiche system dahinter.
Muss man den javascript direkt schreiben oder kann man den fw-menue.js irgendwie miteinbinden ?
speichere das als js. und verlinke es wie eine CSS Datei so ungefähr:
<link href="bla.js" type="text/javascript">
Nur aus Erfahrung geschrieben da ich noch nie JS benutzt habe und daher auch nie einbinden musste^^
BeyondTheTruth
27.08.2005, 08:47
Nope...
<script language="JavaScript" src=http://...../scriptdatei.js></script>
So ich habe jetzt das Menü dank des Quelltextes von Justgamers fertigbauen können aber kann man dort auch Subitems bzw. noch Untereinträge erstellen. Wenn ja wie geht das ?
In der navig.js kannst du neue Menüeionträge erstellen.
Die datei ist eigentlich selbsterklärend
Ich hole meine Scripts oft von http://hotscripts.com/
Ich denke unter 2300 JS Script findest du sicher ein passendes für dich ;)
Jaja, der IE ist hald einfach DOOOOOF!! :D
MFG
redX
In der navig.js kannst du neue Menüeionträge erstellen.
Die datei ist eigentlich selbsterklärend
Das habe ich schon herausgefunden aber gibt es die Möglichkeit bei "navig.js" untereinträge zu erstellen ?
Was meinst du mit Untereinträge?
Sowas hier?
Link 1
Link 2
Link 3
Link 4 ---| Unterlink 1
| Unterlink 2
| Unterlink 3
| Unterlink 4
Wenn ja dann nein :D, nicht soweit ich weiß, da müsstest du ein anderes Script suchen.
Link 4 ---| Unterlink 1
Genau das !!! :) Hmm... ich weiß dann leider nicht mehr weiter !!! Kann mir jemand zu soetwas ein Tutorial geben ?
http://www.tutorials.de/tutorials164340.html
Habe es mir nicht angeschaut. Vieleicht ist es aber das richtige....
MFG
redX
Powered by vBulletin® Version 4.2.3 Copyright ©2025 Adduco Digital e.K. und vBulletin Solutions, Inc. Alle Rechte vorbehalten.