zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Popdown Menü mit CSS

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 08.10.2007, 21:58
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 08.10.2007
Beiträge: 1
Nohma befindet sich auf einem aufstrebenden Ast
Standard Popdown Menü mit CSS

Huhu erstmal!

Hab da mal ne Frage...

Bin dabei zu versuchen ein Dropdown Menü mit css zu machen bzw. umzubauen. Soweit so gut, geht auch alles gut, nur sobald ich meine *.css Datein in der Seite "Eintrag" kann ich beim Popdown Menü nicht mehr die Unterpunkte anklicken da diese sofort verschwinden wenn ich mit der Maus vom Oberpunkt wegfahre.
Die Seite ist in Tabellen aufgebaut (wie gesagt, wenn die css Datei nicht eingetragen ist, funktioniert das Menü)

Das ganze schaut so aus:

Menü:

<ul id="base2" class="base1">
<li class="base"><a href="#" class="base Stil1">Oberpunkt</a>
<ul id="first1" class="first">
<li class="first"><a class="first" a href="neger.html">Unterpunkt1</a></li>
<li class="first"><a class="first" a href="klein.html">Unterpunkt2</a></li>
</ul>
</li>
</ul>

Java im header:

<script type="text/javascript">
startList = function() {
if (document.all&&document.getElementById) {
cssdropdownRoot = document.getElementById("cssdropdown");
for (x=0; x<cssdropdownRoot.childNodes.length; x++) {
node = cssdropdownRoot.childNodes[x];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}

if (window.attachEvent)
window.attachEvent("onload", startList)
else
window.onload=startList;

</script>


css Datei


/* Global Styles */

body {
margin:0px;
}

td {
color:#000000;
border-right-width: 1px;
border-right-style: none;
border-right-color: #26354A;
font-family: Porsche;
font-size: 11px;
}

a {
color: #FF6600;
font-weight:bold;
text-decoration:none;
}

a:hover {
color: #26354A;
}

/* ID Styles */

#navigation a {
font:10px Arial, Helvetica, sans-serif;
color: #26354A;
text-decoration: none;
letter-spacing:.1em;
line-height:16px;
display:block;
padding: 0px 10px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}

#navigation a:hover {
color:#ffffff;
background-color: #26354A;
}

#background td {
background:url(platz.gif);
}

#padding {
padding:14px;
}

/* Calendar Styles */

#calendar td {
border: 1px solid #26354A;
}

#noborder td {
border: 0px;
}

#calheader td {
font-weight:bold;
color: #ffffff;
}

/* Class Styles */

.logo {
font:24px Times New Roman, Times, serif;
color: #FFBA00;
letter-spacing:.3em;
line-height:26px;
}

.tagline {
font: 11px Arial, Helvetica, sans-serif;
color: #D3DCE6;
line-height:16px;
}

.bodyText {
line-height:32px;
color:#26354A;
letter-spacing:.1em;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
}

.detailText {
font:11px Arial, Helvetica, sans-serif;
line-height:16px;
color:#26354A;
letter-spacing:.1em;
}

.pageName {
color: #FF6600;
letter-spacing:.2em;
line-height:20px;
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
}

.subHeader {
font:bold 12px Arial, Helvetica, sans-serif;
color: #2D374D;
font-weight:bold;
line-height:20px;
letter-spacing:.1em;
}

.navText {
font:10px Arial, Helvetica, sans-serif;
color: #26354A;
letter-spacing:.1em;
line-height:16px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: solid;
border-right-width: 1px;
border-right-color: #26354A;
border-left-width: 1px;
border-left-color: #26354A;
}

.calendarText {
font:11px Arial, Helvetica, sans-serif;
color: #26354A;
letter-spacing:.1em;
}


.sidebarText {
font:11px Arial, Helvetica, sans-serif;
color: #FFBA00;
letter-spacing:.1em;
line-height:18px;
}

.bg {
border-bottom: 1px solid #000000;
}

ul.base1, ul.base2, ul.base3 {
margin: 0;
padding: 0;
list-style: none;
width: 93px;
border-bottom: 1px solid #ccc;
float:left;
}
ul.base2 {
margin-left:-1px;
}
ul.base3 {
margin-left:-1px;
}
/* */
ul.first {
position: absolute;
left: 0;
top: 29px;
display: none;
/**/
margin: 0;
padding: 0;
list-style: none;
width: 93px;
border-bottom: 1px solid #ccc;
}
/* */
ul.secound {
position: absolute;
left: 93px;
top: 0;
display: none;
/**/
margin: 0;
padding: 0;
list-style: none;
width: 93px;
border-bottom: 1px solid #ccc;
}
/* */
li.base {
position: relative;
}
/* */
li.first {
position: relative;
}
/* */
a.base, a.first, a.secound {
display: block;
text-decoration: none;
color: #777;
background: #D3DCE6; /* IE6 Bug */
padding: 5px;
border: 1px solid #ccc; /* IE6 Bug */
border-bottom: 0;
}
a.base, a.first, a.secound {
display: block;
text-decoration: none;
color: #777;
background: #D3DCE6; /* IE6 Bug */
padding: 5px;
border: 1px solid #ccc; /* IE6 Bug */
border-bottom: 0;
}
/* Holly Hack. IE Requirement \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
/*****************************************/
li.base:hover ul.first {
display: block;
}
li.first:hover ul.secound {
display: block;
}
/* */
li.base:hover a.base {
background-color:#d7d7d7;
}
li.first:hover a.first {
background-color:#d7d7d7;
}
li.secound:hover a.secound {
background-color:#d7d7d7;
}

li.base1 ul.first, li.base2 ul.first, li.base3 ul.first {
display:block;
}
li.first1 ul.secound, li.first2 ul.secound, li.first3 ul.secound {
display:block;
}
/****************/
* {
font-family:Verdana, Arial, Helvetica, sans-serif;
}






img {
border:none;
}



</style>


Würde mich über Hilfe freuen,

MFG

Johannes

Geändert von Nohma (08.10.2007 um 22:11 Uhr) Grund: css fehler
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Problem mit CSS Dropline menü horst77 CSS 1 12.08.2009 12:49
css menü - bitte schnell um hilfe :please costfree CSS 2 16.01.2009 13:55
herunterfahrendes Menü mit CSS Pablo CSS 1 27.12.2007 18:07
suckerfish menü formatieren / css zurücksetzen / bug sicnezz (X)HTML 1 13.12.2007 06:47
Menü mit CSS aber mit JS Animation? xy2er CSS 6 20.03.2005 21:47


Alle Zeitangaben in WEZ +2. Es ist jetzt 08:12 Uhr.