Und zwar ist da ein kleiner Abstand zwischen der Kategorie und den Links dieser muss/sollte aber weg, nur ich bekomm den nich weg
*heul*
Hier wird es gezeigt was ich meine:
Naja ich weis jetzt nich ob ich in der im Style etwas ändern muss oder in dem javascript...
Kann mir da wer weiter helfen?
Also hier mal den gesamten Code.
CSS-Code des Klappmenüs:
body { font-size: 0.7em; }
h3 { font-size: 1.6em; margin: 0px; }
a.sample_attach, a.sample_attach:visited, div.sample_attach
{
display: block;
width: 100px;
border: 1px solid black;
padding: 2px 5px;
background: #FFFFEE;
text-decoration: none;
font-family: Verdana, Sans-Sherif;
font-weight: 900;
font-size: 1.0em;
color: #008000;
}
a.sample_attach, a.sample_attach:visited { border-bottom: none; }
div#sample_attach_menu_child { border-bottom: 1px solid black; }
form.sample_attach
{
position: absolute;
visibility: hidden;
border: 1px solid black;
padding: 0px 0px 0px 0px;
background: #FFFFEE;
}
form.sample_attach b
{
font-family: Verdana, Sans-Sherif;
font-weight: 900;
font-size: 1.1em;
}
input.sample_attach { margin: 1px 0px; width: 170px; }
Javascript des Klappmenüs:
function at_show_aux(parent, child)
{
var p = document.getElementById(parent);
var c = document.getElementById(child );
var top = (c["at_position"] == "y") ? p.offsetHeight+2 : 0;
var left = (c["at_position"] == "x") ? p.offsetWidth +2 : 0;
for (; p; p = p.offsetParent)
{
top += p.offsetTop;
left += p.offsetLeft;
}
c.style.position = "absolute";
c.style.top = top +'px';
c.style.left = left+'px';
c.style.visibility = "visible";
}
// ***** at_show *****
function at_show()
{
var p = document.getElementById(this["at_parent"]);
var c = document.getElementById(this["at_child" ]);
at_show_aux(p.id, c.id);
clearTimeout(c["at_timeout"]);
}
// ***** at_hide *****
function at_hide()
{
var p = document.getElementById(this["at_parent"]);
var c = document.getElementById(this["at_child" ]);
c["at_timeout"] = setTimeout("document.getElementById('"+c.id+"').style.visibility = 'hidden'", 333);
}
// ***** at_click *****
function at_click()
{
var p = document.getElementById(this["at_parent"]);
var c = document.getElementById(this["at_child" ]);
if (c.style.visibility != "visible") at_show_aux(p.id, c.id); else c.style.visibility = "hidden";
return false;
}
// ***** at_attach *****
// PARAMETERS:
// parent - id of the parent html element
// child - id of the child html element that should be droped down
// showtype - "click" = drop down child html element on mouse click
// "hover" = drop down child html element on mouse over
// position - "x" = display the child html element to the right
// "y" = display the child html element below
// cursor - omit to use default cursor or specify CSS cursor name
function at_attach(parent, child, showtype, position, cursor)
{
var p = document.getElementById(parent);
var c = document.getElementById(child);
p["at_parent"] = p.id;
c["at_parent"] = p.id;
p["at_child"] = c.id;
c["at_child"] = c.id;
p["at_position"] = position;
c["at_position"] = position;
c.style.position = "absolute";
c.style.visibility = "hidden";
if (cursor != undefined) p.style.cursor = cursor;
switch (showtype)
{
case "click":
p.onclick = at_click;
p.onmouseout = at_hide;
c.onmouseover = at_show;
c.onmouseout = at_hide;
break;
case "hover":
p.onmouseover = at_show;
p.onmouseout = at_hide;
c.onmouseover = at_show;
c.onmouseout = at_hide;
break;
}
}
Html-Code des Klappmenüs:
<div id="sample_attach_menu_parent" class="sample_attach">Main Menu</div>
<div id="sample_attach_menu_child">
<a class="sample_attach" href="javascript:alert('Item 1');">Item 1</a>
<a class="sample_attach" href="javascript:alert('Item 2');">Item 2</a>
<a class="sample_attach" href="javascript:alert('Item 3');">Item 3</a>
<script type="text/javascript">
at_attach("sample_attach_menu_parent", "sample_attach_menu_child", "hover", "y", "pointer");
</script></div>
Also ich hab so das Gefühl das ich etwas in den CSS-Teil rein tun muss, aber keine Ahnung was -.-
Also über Hilfe freu ich mich!
MfG
Zitat geschrieben von Ahrta5