Jump to content

Help With This Menu


Maisara-WD
 Share

Recommended Posts

Hican you tell me how to make the submenu display to the left direction of the item that activates it, and not to the right as in the code:that's the style:

<style>.rightnav_menu{	width: 152px;	height: 294px;	direction: rtl;	text-align: right;	clear: both;	margin: 0px;	float: right;	background-color: #cae9eb;}.rightnav_menu ul{	margin: 0;	padding: 0;	list-style-type: none;	font-family: Tahoma, Geneva, sans-serif;	font-size: 10pt;	font-weight: bold;	width: 152px;}.rightnav_menu ul li{	position: relative;}.rightnav_menu ul li a{	display: block;	overflow: auto;	color: #DCDBF9;	text-decoration: none;	padding: 6px;}.rightnav_menu ul li a:link, .rightnav_menu ul li a:visited, .rightnav_menu ul li a:active{	background-color: #012D58;}.rightnav_menu ul li a:hover{	background-color: #000000;}.rightnav_menu ul li ul{	position: absolute;	width: 152px;	top: 0;	visibility: hidden;}* html .rightnav_menu ul li { float: left; height: 1%; }* html .rightnav_menu ul li a { height: 1%; }</style>

that's the script:

<script type="text/javascript">//Nested Side Bar Menu (Mar 20th, 09)//By Dynamic Drive: http://www.dynamicdrive.com/style/var menuids=["sidebarmenu"] //Enter id(s) of each Side Bar Menu's main UL, separated by commasfunction initsidebarmenu(){for (var i=0; i<menuids.length; i++){  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")	for (var t=0; t<ultags.length; t++){	ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle"  if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu   ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item  else //else if this is a sub level submenu (ul)	ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it	ultags[t].parentNode.onmouseover=function(){	this.getElementsByTagName("ul")[0].style.display="block"	}	ultags[t].parentNode.onmouseout=function(){	this.getElementsByTagName("ul")[0].style.display="none"	}	}  for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars  ultags[t].style.visibility="visible"  ultags[t].style.display="none"  }  }}if (window.addEventListener)window.addEventListener("load", initsidebarmenu, false)else if (window.attachEvent)window.attachEvent("onload", initsidebarmenu)</script>

That's the HTML Code:

<div class="rightnav_menu">  <ul id="sidebarmenu">	<li>	<a href="#">أنشطة المدرسة</a>		<ul>			<li><a href="#">ديني</a></li>			<li><a href="#">ثقافي</a></li>			<li><a href="#">تكنولوجيا المعلومات</a></li>			<li><a href="#">اللغة الإنجليزية</a></li>			<li><a href="#">المكتبات</a></li>			<li><a href="#">الأنشطة العلمية</a></li>			<li><a href="#">التربية الرياضية</a></li>			<li><a href="#">التربية الفنية</a></li>			<li><a href="#">التربية الاجتماعية</a></li>		</ul>		</li>	<li>	<a href="#">خدمات الموقع</a>		<ul>			<li><a href="#">جداول الامتحانات</a></li>			<li><a href="#">نتائج الامتحانات</a></li>			<li><a href="#">الغياب اليومي</a></li> 		</ul>	</li>	<li>	<a href="#">معلومات تهمك</a>		<ul>			<li><a href="#">التقديم و القبول</a></li>			<li><a href="#">المصاريف</a></li>			<li><a href="#">أجندة المدرسة</a></li>			<li><a href="#">الأتوبيسات</a></li>			<li><a href="#">الزي المدرسي</a></li>			</ul>		</li>	<li><a href="#">روابط تهمك</a></li>	<li><a href="#">الطلبة المتفوقون</a></li>	<li><a href="#">أرسل رأيك</a></li>	<li><a href="#">اتصل بنا</a></li>  </ul></div>

I'll be so greatful...I think the solution is in that lin:

ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px"

Thanks in advance

Link to comment
Share on other sites

http://www.anashare.com/get.aspx?download=166

before your change

http://www.anashare.com/get.aspx?download=167

After your change

Link to comment
Share on other sites

I replaced the line justsomeguy told me to add, by your two lines but it did'nt work, it didn't even show sub menues, but it puts the folder items at their correct place at the right.. except the first one :)such a strange result ha :)

Link to comment
Share on other sites

all browsers including IE6 show this, which is what i think you want.sublevel1.gifsublevel2.gifsublevel3.gifBut IE7 still produces this befroe and after changessublevel4.gifbelow is code used<script type="text/javascript">/*<![CDATA[*//*---->*///Nested Side Bar Menu (Mar 20th, 09)//By Dynamic Drive: http://www.dynamicdrive.com/style/var menuids=["sidebarmenu"] //Enter id(s) of each Side Bar Menu's main UL, separated by commasfunction initsidebarmenu(){for (var i=0; i<menuids.length; i++){ var ultags=document.getElementById(menuids).getElementsByTagName("ul") for (var t=0; t<ultags.length; t++){ ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle" if (ultags[t].parentNode.parentNode.id==menuids) //if this is a first level submenu ultags[t].style.left="-"+ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item else //else if this is a sub level submenu (ul) ultags[t].style.left="-"+ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px"; //position menu to the right of menu item that activated it ultags[t].parentNode.onmouseover=function(){ this.getElementsByTagName("ul")[0].style.display="block" } ultags[t].parentNode.onmouseout=function(){ this.getElementsByTagName("ul")[0].style.display="none" } } for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars ultags[t].style.visibility="visible" ultags[t].style.display="none" } }}if (window.addEventListener)window.addEventListener("load", initsidebarmenu, false)else if (window.attachEvent)window.attachEvent("onload", initsidebarmenu)/*--*//*]]>*/</script>

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...