| Autor |
Nachricht |
irenehofer
Threadersteller
Dabei seit: 07.06.2010
Ort: Chur
Alter: -
Geschlecht: 
|
Verfasst Mo 07.06.2010 16:33
Titel
|
  |
|
Vielen lieben Dank an top und zweitaccount! Endlich ein Forum in dem man nicht gleich angepöbelt wird  Nur noch eine allerletzte Frage. Ist es möglich, bei der aktiven Seite das Drop Down aufgeklappt zu lassen? Wenns zu kompliziert ist, lasse ich es weg, aber würde mich mal interessiernen.
Nochmals besten Dank!!!
|
|
| |
  |
 |
zweitaccount
Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mo 07.06.2010 17:11
Titel
|
|
|
Hmm, also die aktive Ul dürftest du so eingeblendet bekommen:
| Code: | #nav li.current_page_ancestor ul {
left:auto;
}
|
| irenehofer hat geschrieben: | | Endlich ein Forum in dem man nicht gleich angepöbelt wird |
ohwei ....freu Dich nicht zufrüh 
|
|
| |
|
|
|
Anzeige
|
|
|
irenehofer
Threadersteller
Dabei seit: 07.06.2010
Ort: Chur
Alter: -
Geschlecht:
|
Verfasst Mo 07.06.2010 17:16
Titel
|
|
|
|
Bis jetzt jedenfalls Super, vielen Dank! Jetzt funktionert es genau so wie ich es wollte!
|
|
| |
|
|
irenehofer
Threadersteller
Dabei seit: 07.06.2010
Ort: Chur
Alter: -
Geschlecht:
|
Verfasst Di 08.06.2010 10:49
Titel Internet Explorer Drop Down Problem |
|
|
Jetzt habe ich doch nochmal ein Problem. Diesmal mit der Browseroptimierung - sprich Internet Explorer. Die Navigation funktioniert nun über ein Drop Down. Wenn eine Seite angewählt wurde, blieben die weiteren dazugehörigen Punkte stehen http://tennis-roger.ch
Der Explorer bringt nun alles durcheinander. Es wird noch die Hintergrund-Grafik angezeigt (was natürlich nicht sein sollte) und die ganze Navigation schiebt es zu weit nach rechts.
Im CSS sieht es nun folgendermassen aus:
| Code: | #nav {
text-align:left;
float:left;
padding-left:30px;
padding-top:15px;
}
#nav ul {
margin:0;
display:block;
list-style:none;
}
#nav ul li a {
color:#024d7c;
font-size:1.3em;
float:left;
height:23px;
padding:0 22px 0 22px;
margin: 0 2px 0 2px;
display:block;
text-decoration:none;
}
#nav li {
height:40px;
float: left;
list-style: none;
}
#nav ul li.current_page_item a, #nav ul li.current_page_ancestor a {
color:#024d7c;
float:left;
height:23px;
padding:0 22px 0 22px;
margin:0 2px 0 2px;
display:block;
text-decoration:none;
background-image:url(images/rl_linie.png);
background-position:center;
background-repeat:no-repeat;
}
#nav li:hover {
color:#024d7c;
float:left;
height:23px;
background-image:url(images/rl_linie.png);
background-position:center;
background-repeat:no-repeat;
text-decoration:none;
}
#nav a, #nav a:visited {
height:23px;
display: block;
color: #024d7c;
text-decoration:none;
}
#nav li.current_page_ancestor ul {
left:auto;
}
/* Dropdown Menus */
#nav li ul {
float:left;
margin-top:30px;
margin-left:15px;
position: absolute;
left: -999em;
padding: 0px;
height: auto;
width: 174px;
list-style:none;
font-size:0.8em;
}
#nav li li, #nav li li a, #nav li li:hover, #nav li li a:visited, #nav li li a:active {
height:15px;
width:172px;
background-image:none;
list-style:none;
padding-left:10px;
}
#nav li li a, #nav li li a:visited {
background-image:none;
display:block;
text-decoration:none;
color:#3ec7f4;
margin:0;
padding:0;
}
#nav li li a:hover, #nav li li a:active {
background-image:none;
text-decoration:none;
color:#024d7c;
}
#nav li li.current_page_item a {
color:#024d7c;
text-decoration:none;
margin:0;
padding:0;
background:none;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
left: auto;
}
a.main:hover {
background:none;
}
|
Wie krieg ich das nun auch für IE optimal hin?
|
|
| |
|
|
zweitaccount
Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 08.06.2010 12:07
Titel
|
|
|
Hmm, also das css ist etwas vermurkst - imho. Hab da jetzt nur
mal kurz drübergeschaut und etwas 'entmüllt':
| Code: | /*------------------------- START Navigation---------------------------------*/
/*Main Navbar */
#nav {
float:left;
padding-left:30px;
padding-top:15px;
}
#nav ul {
margin:0;
display:block;
list-style:none;
}
#nav a {
display:block;
color:#024d7c;
text-decoration:none;
height:23px;
}
#nav a:visited {
color:#024d7c;
}
#nav a:hover {
color:#3ec7e4;
text-decoration:none;
}
/* ebene 1 */
#nav li {
position:relative;
height:40px;
float:left;
display:block;
}
#nav li a {
display:block;
font-size:1.3em;
float:left;
padding:0 22px 0 22px;
margin:0 2px 0 2px;
}
/* ebene 1 aktives element + hover */
#nav li:hover a,
#nav li.current_page_item a {
color:#3ec7e4;
background-image:url(images/rl_linie.png);
background-position:center;
background-repeat:no-repeat;
}
/* ebene 2 */
#nav li ul {
position:absolute;
left:0;
top:30px;
padding:0;
height:auto;
width:auto;
display:none;
}
/* ebene 2 submenu li */
#nav li li {
height:15px;
width:auto;
font-size:0.8em;
float:none;
}
#nav li li a {
height:auto;
}
/* kein background für ebene 2 a */
#nav li:hover li a,
#nav li.current_page_item li a {
background:none;
color:#024d7c;
}
#nav li:hover li a:hover,
#nav li.current_page_item li a:hover,
#nav li.current_page_item li.current_page_item a {
color:#3ec7e4;
}
/* ebene 2 hover + aktives submenu */
#nav li:hover ul,
#nav li.current_page_item ul {
display:block;
}
/*----------------------- ENDE Navigation -----------------------*/ |
Kann man sicherlich noch besser definieren.... , funzen müsste
es aber theoretisch.
IE6 ist jetzt mal ganz außen vor gelassen.
Grüße
zweitaccount
|
|
| |
|
|
irenehofer
Threadersteller
Dabei seit: 07.06.2010
Ort: Chur
Alter: -
Geschlecht:
|
Verfasst Di 08.06.2010 13:07
Titel
|
|
|
Sieht schon mal viel besser aus  Einzig wenn ich eine Unterseite aktiv habe, dann verschwinden die dazugehörigen Punkte wieder. Soll heissen:
Hauptseite: Unterricht
Untersseiten: Standorte, Kurse/Preise, Trainingslager
Klicke ich auf Unterricht, erscheinen die 3 Unterseiten. Wenn ich aber beispielsweise Standorte aufrufe, sind diese 3 Punkte nicht mehr sichtbar (ausser natürlich Drop Down) und die Hauptseite erscheint nicht mehr als aktiv...
|
|
| |
|
|
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht: 
|
Verfasst Di 08.06.2010 14:55
Titel
|
|
|
das hier:
| Code: | /* ebene 2 hover + aktives submenu */
#nav li:hover ul,
#nav li.current_page_item ul {
display:block;
}
|
so erweitern:
| Code: | /* ebene 2 hover + aktives submenu */
#nav li:hover ul,
#nav li.current_page_item ul,
#nav li.current_page_parent ul {
display:block;
}
|
das hier:
| Code: | #nav li:hover a,
#nav li.current_page_item a {
color:#3ec7e4;
background-image:url(images/rl_linie.png);
background-position:center;
background-repeat:no-repeat;
} |
so erweitern:
| Code: | #nav li:hover a,
#nav li.current_page_item a,
#nav li.current_page_ancestor a {
color:#3ec7e4;
background-image:url(images/rl_linie.png);
background-position:center;
background-repeat:no-repeat;
} |
Zuletzt bearbeitet von sahnemuh am Di 08.06.2010 14:56, insgesamt 1-mal bearbeitet
|
|
| |
|
|
irenehofer
Threadersteller
Dabei seit: 07.06.2010
Ort: Chur
Alter: -
Geschlecht:
|
Verfasst Di 08.06.2010 16:13
Titel
|
|
|
Im Explorer funktionert das mit dem Hintergrund wieder nicht mehr (die Linien werden bei den Unterseiten angezeigt). Habe nun schon hin- und her probiert, leider aber nicht hinbekommen...
| Code: |
/*------------------------- START Navigation---------------------------------*/
/*Main Navbar */
#nav {
float:left;
padding-left:30px;
padding-top:15px;
}
#nav ul {
margin:0;
display:block;
list-style:none;
}
#nav a {
display:block;
color:#024d7c;
text-decoration:none;
height:23px;
}
#nav a:visited {
color:#024d7c;
}
#nav a:hover {
color:#3ec7e4;
text-decoration:none;
}
/* ebene 1 */
#nav li {
position:relative;
height:40px;
float:left;
display:block;
}
#nav li a {
display:block;
font-size:1.3em;
float:left;
padding:0 22px 0 22px;
margin:0 2px 0 2px;
}
/* ebene 1 aktives element + hover */
#nav li:hover a,
#nav li.current_page_item a,
#nav li.current_page_ancestor a {
color:#024d7c;
background-image:url(images/rl_linie.png);
background-position:center;
background-repeat:no-repeat;
}
/* ebene 2 */
#nav li ul {
position:absolute;
left:0;
top:30px;
padding:0;
height:auto;
width:auto;
display:none;
}
/* ebene 2 submenu li */
#nav li li {
height:15px;
width:auto;
font-size:0.8em;
float:none;
}
#nav li li a {
height:auto;
}
/* kein background für ebene 2 a */
#nav li:hover li a,
#nav li.current_page_item li a {
background:none;
color:#024d7c;
}
#nav li:hover li a:hover,
#nav li.current_page_item li a:hover,
#nav li.current_page_item li.current_page_item a {
color:#3ec7e4;
}
/* ebene 2 hover + aktives submenu */
#nav li:hover ul,
#nav li.current_page_item ul,
#nav li.current_page_parent ul {
display:block;
}
/*----------------------- ENDE Navigation -----------------------*/ |
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
wordpress drop down menü einbauen
[css] schrift verschwindet
Seiteinhalt verschwindet im IE
Photoshop: Auswahlkante verschwindet
Google+ Button verschwindet
onMouseOut-Grafik verschwindet im IE
|
|
Willkommen auf dem Portal für Mediengestalter
