472,145 Members | 1,398 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,145 software developers and data experts.

Query regarding collapsible Menu

Hi,

I am facing a problem for the allignment of the submenus under same line with the menu. Actually after clicking the menus the submenus should come exactly under same line with the menu but it is coming with some space.Can anyone help me in this regard. I am giving the total html code below which contains the javascript too.

Code:-

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style>
<!--
#foldheader{cursorointer;cursor:hand ; font-weight:bold}


//-->
</style>
<script language="JavaScript1.2">
<!--

//Smart Folding Menu tree- By Dynamic Drive (rewritten 03/03/02)
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use


var ns6=document.getElementById&&!document.all
var ie4=document.all

function checkcontained(e)
{
var iscontained=0
cur=ns6? e.target : event.srcElement
i=0
if (cur.id=="foldheader")
iscontained=1
else
while (ns6&&cur.parentNode||(ie4&&cur.parentNode))
{
if (cur.id=="foldheader"||cur.id=="foldinglist")
{
iscontained=(cur.id=="foldheader")? 1 : 0
break
}
cur=ns6? cur.parentNode : cur.parentNode
}

if (iscontained)
{
var foldercontent=ns6? cur.nextSibling.nextSibling : cur.all.tags("UL")[0]
if (foldercontent.style.display=="none")
{
foldercontent.style.display=""

}
else
{
foldercontent.style.display="none"

}
}
}

if (ie4||ns6)
document.onclick=checkcontained

//-->
</script>
</HEAD>

<BODY>
<font face="Verdana">

<ul>
<li id="foldheader">News</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.cnn.com">CNN</a></li>
<li><a href="http://www.abcnews.com">ABC News</a></li>
<li><a href="http://www.news.bbc.co.uk">BBC News</a></li>
</ul>

<li id="foldheader">Webmaster</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.dynamicdrive.com">Dynamic Drive</a></li>
<li><a href="http://www.javascriptkit.com">JavaScript Kit</a></li>
<li><a href="http://www.freewarejava.com">Freewarejava.com</a></li>
</ul>

<li id="foldheader">Nested Example</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.dynamicdrive.com">outer 1</a></li>
<li><a href="http://www.dynamicdrive.com">outer 2</a></li>
<li id="foldheader">Nested</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.dynamicdrive.com">nested 1</a></li>
<li><a href="http://www.dynamicdrive.com">nested 2</a></li>
</ul>
<li><a href="http://www.dynamicdrive.com">outer 3</a></li>
<li><a href="http://www.dynamicdrive.com">outer 4</a></li>
</ul>
</ul>

</font>
</BODY>
</HTML>


Thanks in advance.
Jan 17 '08 #1
2 2119
harshmaul
490 Expert 256MB
hi
add this style
Also you need to validate yout code you've got many IDs all over the place. use classes if there is more than one


Expand|Select|Wrap|Line Numbers
  1. #foldinglist{
  2. margin-left:0px;
  3. }
Jan 28 '08 #2
Thanks Man...It worked now.

Appreciated.

Thanks & Regards,
Mukti

hi
add this style
Also you need to validate yout code you've got many IDs all over the place. use classes if there is more than one


Expand|Select|Wrap|Line Numbers
  1. #foldinglist{
  2. margin-left:0px;
  3. }
Jan 29 '08 #3

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

reply views Thread by madhur | last post: by
7 posts views Thread by David T. Ashley | last post: by
reply views Thread by Saiars | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.