Hallo,
Ich habe eine Seite mit TV erstellt, und ein Beispiel Menue wie hier:
http://www.mortox.de/typo3-tipps/typoscript-sammlung/dropdown-menue.html
eingefügt, was ja einfach sein soll....
Das Javascript habe ich in das html-Template eingefügt, Das TS ins Typo3 Template und die css-Formatiewrungen am Anfang meiner css Datei.
Typoversion: 4.2.1
Erste Ebene funktioniert, zweite geht nicht?!?
(versch. Browser)
Kann mir jemand helfen? Vielen Dank.
Vielleicht eine Hilfe: Beim ersten überfahren mit der Maus zeigt der Browser unten schon irgendeinen Scriptfehler...
Hier die Codes:
Typoscript
# Default PAGE object:
page = PAGE
page.typeNum = 0
page.10 = USER
page.10.userFunc = tx_templavoila_pi1->main_page
### Menü ###
lib.HauptMenu = HMENU
lib.HauptMenu {
entryLevel = 0
### Erste Ebene ###
1 = TMENU
1 {
wrap = <ul class="menu">|</ul>
expAll = 1
NO.wrapItemAndSub = <li onmouseover="show(this)" onmouseout="hide(this)">|</li>
ACT < .NO
ACT = 1
ACT.ATagParams = class="active"
}
### Zweite Ebene ###
2 = TMENU
2 {
wrap = <ul onmouseover="show(this)" onmouseout="hide(this)">|</ul>
NO.allWrap = <li>|</li>
}
}
css-datei:
/*CSS vom Menuebeispiel*/
ul.menu, ul.menu ul {
list-style-type: none;
}
ul.menu a {
display: block;
padding: 3px 10px 3px 10px;
font-weight:normal;
}
ul.menu ul a {
padding: 0 10px;
}
ul.menu li {
padding:0;
margin:0;
background-image: none;
background-color: #FFF9E4;
float:left;
border:1px solid #26383D;
}
ul.menu ul {
margin-left:0;
padding: 0 0 5px 0;
position: absolute;
background-color: #26383D;
border:1px solid #FFF9E4;
display:none;
min-width:180px;
}
/* IE-Hack für die Breite */
*html ul.menu ul {
width:180px;
}
/* Dies sind die Klassenstile für das Untermenü wenn sich die Maus */
/* über der Liste befindet (.hover siehe JavaScript oben) */
ul.menu ul.hover, ul.menu li.hover ul, ul.menu li:hover ul {
display:block;
}
ul.menu ul li {
float:none;
background-color: transparent;
}
/*CSS Menuebeispiel ende*/
/*
Original design: andreas09 (v2.2 - July 07, 2008-) - A free xhtml/css website template by Andreas Viklund.
For more information, see http://andreasviklund.com/templates/andreas09/
*/
/* Main tags */
body {background:#8b8b8b; color:#303030; font:76% Verdana,Tahoma,Arial,sans-serif; margin:0; padding:0; text-align:center;}
a {color:#505050; font-weight:bold; text-decoration:none;}
a:hover {color:#808080; text-decoration:underline;}
p {line-height:1.5em; margin:0 0 15px;}
/* Main container */
#container {background:#f0f0f0 url(img/bodybg.jpg) repeat-x; color:#303030; margin:0 auto; width:970px; padding:0; text-align:left;}
/* Header section */
#sitename {color:#ffffff; height:92px; margin:0 20px 10px; text-align:left;}
#sitename h1,#sitename h2 {font-weight:400; letter-spacing:-2px; margin:0; padding:0;}
#sitename h1 {font-size:2.0em; padding-top:20px;}
#sitename h2 {font-size:1.6em;}
/* Horizontal menu */
#mainmenu {
float:left;
}
/* Content wrap */
#wrap {clear:both; font-size:0.9em; padding:0;}
/* Sidebars */
#leftside,#rightside {margin:0; padding:0 10px 10px; width:165px;}
#leftside {float:left; margin-right:10px;}
#rightside {float:right; margin-left:10px;}
#leftside h1,#rightside h1 {color:#505050; font-size:1.6em; font-weight:bold; letter-spacing:-1px; margin:0 0 12px;}
#leftside h2,#rightside h2 {font-size:1.1em; margin:0 0 20px;}
#leftside p,#rightside p {font-size:0.9em; line-height:1.4em; margin:0 0 16px 10px;}
/* Content */
#content,#contentalt {background-color:#fafcff; border:1px solid #909090; color:#2a2a2a; padding:15px 20px 5px;}
#content {margin:0 200px;}
#contentalt {margin:0 200px 0 20px;}
#content h1,#content h2,#contentalt h1,#contentalt h2 {background-color:inherit; color:#606060; font-size:1.4em; font-weight:bold; letter-spacing:-1px; margin:0 0 15px; padding:0;}
#content h2,#contentalt h2 {font-size:1.0em; margin-bottom:10px;}
#content img,#contentalt img {border:1px solid #b0b0b0; float:left; margin:5px 15px 6px; padding:5px;}
/* Footer */
#footer {background:#8b8b8b url(img/footerbg.jpg) top left repeat-x; clear:both; color:#d0d0d0; font-size:0.9em; font-weight:bold; margin:0; padding:20px 0; text-align:center; width:100%;}
#footer a {color:#d0d0d0; font-weight:bold;}
und das template:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="Your description goes here" />
<meta name="keywords" content="your,keywords,goes,here" />
<meta name="author" content="Your Name" />
<link rel="stylesheet" type="text/css" href="andreas09.css" title="andreas09" media="screen,projection" />
<title>andreas09 v2.2</title>
<script type="text/javascript">
//<![CDATA[
function show(element){
element.className += "hover";}
function hide(element){
element.className = element.className = "";}
//]]>
</script>
</head>
<body>
<div id="container">
<div id="sitename">
</div>
<div id="mainmenu">
</div>
<div id="wrap">
<div id="rightside">
</div>
<div id="contentalt">
</div>
<div class="clearingdiv"> </div>
</div>
</div>
<div id="footer">
<p>© 2008 <a href="#">Your Name</a> | <a href="http://www.yours4money.com">Casino</a> | <a href="http://andreasviklund.com/templates/" title="Original CSS template design">Original design</a> by <a href="http://andreasviklund.com/" title="Andreas Viklund">Andreas Viklund</a></p>
</div>
</body>
</html