Autor |
Nachricht |
CamCat
Threadersteller
Dabei seit: 08.02.2010
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Do 06.01.2011 14:27
Titel Hilfe beim DropDown Menü |
|
|
Salut liebe Mediengestalter,
bitte helft mir.
Ich habe die Seite "www.cascade-bremen.de" gebastelt
und wollte in dem Menüpunkt "Galerie" ein dropdown Menü mit 3 unterprunkten
einfügen.
Nach nun 5 anläufen die mein Design mehr zerschossen und wenig funktioniert haben,
hoffe ich auf eure Hilfe.
Selfhtml und sämmtliche andere Seiten konnten es nicht
LG Cat
|
|
|
|
|
Sp4wNi
Dabei seit: 26.10.2010
Ort: Düsseldorf
Alter: 37
Geschlecht:
|
Verfasst Do 06.01.2011 16:09
Titel
|
|
|
was genau hast du denn versucht? In css oder in Javascript?
|
|
|
|
|
Anzeige
|
|
|
DerM
Dabei seit: 18.01.2009
Ort: -
Alter: 42
Geschlecht:
|
Verfasst Do 06.01.2011 16:33
Titel
|
|
|
DIVs als Navigation, na Prost Mahlzeit...
Was hast Du denn bisher versucht? Zeig doch ma wat ..
|
|
|
|
|
humankatapult
Dabei seit: 05.11.2004
Ort: Abteilung VII Intern
Alter: -
Geschlecht:
|
Verfasst Do 06.01.2011 16:58
Titel
|
|
|
CSS Javaskript Currywurst?
|
|
|
|
|
CamCat
Threadersteller
Dabei seit: 08.02.2010
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Do 06.01.2011 17:30
Titel
|
|
|
Ich hab beides versucht...
Sollte ich keine Css-DIVs als Navigation benutzen?
...sollte ich lieber gifs bzw jpgs nutzen?
Ich dachte dann könnte man die punkte leichter austauschen, wenn sich etwas ändert.
Ist meine erste html-css seite, und ich versuche mir das selbst beizubringen -.-
Was ich versucht hatte habe ih wieder verworfen...
Geht das mit den Div-Tags überhaubt?
|
|
|
|
|
Sp4wNi
Dabei seit: 26.10.2010
Ort: Düsseldorf
Alter: 37
Geschlecht:
|
Verfasst Do 06.01.2011 17:50
Titel
|
|
|
mal off topic:
BITTE baue eine skip funktion in das flash intro.
Für mich persönlich total nervig wenn ich mir ein Intro angucken MUSS!!
ansonsten schau dir mal sowas in der richtung an:
http://htmldog.com/articles/suckerfish/dropdowns/
wird natürlich mit UL und LI gearbeitet sprich du musst deine navi umbauen;>
|
|
|
|
|
DesignKater
Dabei seit: 26.06.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 07.01.2011 17:05
Titel
|
|
|
CamCat hat geschrieben: | Ich hab beides versucht...
Sollte ich keine Css-DIVs als Navigation benutzen?
...sollte ich lieber gifs bzw jpgs nutzen?
Ich dachte dann könnte man die punkte leichter austauschen, wenn sich etwas ändert.
Ist meine erste html-css seite, und ich versuche mir das selbst beizubringen -.-
Was ich versucht hatte habe ih wieder verworfen...
Geht das mit den Div-Tags überhaubt? |
Für Links nimmt man einfache a Tags und weist denen die Klasse zu. Für die Darstellung von Navigation verwendet man in der Regel ein Listenelement. Dann geht das auch ganz simpel mit dem Dropdown.
Quick and dirty:
Code: |
<style type="text/css">
li {
list-style:none;
}
ul.ebene1 {
margin:0;
padding:0;
font:normal 12px arial;
width:200px;
background:#999;
}
ul.ebene2 {
background:#CCC;
margin:0;
padding:0;
display:none;
}
li {
display:block;
padding:3px 10px;
}
li a {
color:#555;
text-decoration:none;
}
li a:hover {
text-decoration:underline;
}
ul.ebene1 li:hover ul.ebene2 {
display:block;
}
</style>
</head>
<body>
<ul class="ebene1">
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a>
<ul class="ebene2">
<li><a href="#">Link 2.1</a></li>
<li><a href="#">Link 2.2</a></li>
<li><a href="#">Link 2.3</a></li>
</ul>
</li>
<li><a href="#">Link 3</a></li>
</ul>
|
|
|
|
|
|
CudaTR
Dabei seit: 16.10.2007
Ort: -
Alter: 38
Geschlecht:
|
Verfasst Do 21.07.2011 16:25
Titel
|
|
|
Hey @ all
ich hab das Dropdown von suckerfish und komm einfach net weiter. Ich hab ne Seite über DIVs mit nem iFrame aufgebaut. Sobald ich aber die Position von der Navigationsleiste ändere funktioniert das aufklappen nicht richtig. Heißt, es klappt direkt wieder zu, sobald ich vom "Mainbutton" runterscrolle. Bitte um Hilfe, weiß nicht welchen Wert ich anpassen muss.
Quellcode:
Code: | <div id="Navcontainer">
<ul id="navi">
<li><a href="#">Home</a></li>
<li><a href="#">Academy</a>
<ul>
<li><a href="#">Person</a></li>
<li><a href="#">Konzept</a></li>
<li><a href="#">Schwerpunkte</a></li>
</ul>
</li>
<li><a href="#">Beratung</a>
<ul>
<li><a href="#">Gründung</a></li>
<li><a href="#">Entwicklung</a></li>
<li><a href="#">Kauf/Verkauf</a></li>
</ul>
</li>
<li><a href="#">Coaching</a>
<ul>
<li><a href="#">Basis</a></li>
<li><a href="#">Business</a></li>
<li><a href="#">Karriere</a></li>
<li><a href="#">Balance</a></li>
</ul>
</li>
<li><a href="#">Training</a>
<ul>
<li><a href="#">Training</a></li>
<li><a href="#">Führung</a></li>
<li><a href="#">Team</a></li>
</ul>
</li>
<li><a href="#">eLearning</a></li>
<li><a href="#">Medien</a>
<ul>
<li><a href="#">Publikationen</a></li>
<li><a href="#">Podcasts</a></li>
<li><a href="#">Radio</a></li>
</ul>
</li>
<li><a href="#">Kontakt</a></li>
</ul>
</div> |
CSS: (Der Ausschnitt der die Navigation beschreibt)
Code: | /*###################*/
/* Beginn Navigation */
/*###################*/
#navi, #navi ul {
list-style-type:none;
margin:0;
padding:0;
} /* Style-Reset */
#navi li {
width:128px;
float:left;
} /* Horizontale Anordnung */
#navi li ul {
display:none;
} /* Normalzustand eingeklappt */
#navi li:hover ul {
display:block;
} /* Ausgeklappt */
/*###################*/
/* Styles fuers Auge */
/*###################*/
#navcontainer {
height:16px;
position:relative;
}
#navi {
position:absolute;
left: 0px;
top: 130px;
}
#navi li {
border:0px;
margin:0 0px 0 0;
}
#navi ul li {
border:none;
margin:0;
}
#navi a {
font-weight:bold;
text-align:center;
display:block;
padding:0.1em;
}
#navi a:link, #navi a:visited {
color:#FFF;
background:#A8CFF0;
text-decoration:underline;
}
#navi a:active, #navi a:hover {
color:#000;
background:#FFF;
text-decoration:none;
} |
Wäre schön wenn jemand helfen kann. Sobald ich bei #navi den Wert top:130px eingebe funktioniert das Menü nicht mehr. Kann ich irgendwoanders definieren dass die Navileiste 130px vom oberen Rand weg ist ???
Gruß und Danke
|
|
|
|
|
|
|
|
Ähnliche Themen |
Dropdown Menü
DropDown Menü verschwindet
JavaScript-Dropdown-Menü
CSS Javascript Dropdown menü
IE Fehler bei DropDown Menü
[FLASH] DropDown Menü
|
|