Hi
see this script please:
<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>
<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 commas
function 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
//dynamically position first level submenus to be width of main menu item
ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px"
} else {
//else if this is a sub level submenu (ul)
//position menu to the right of menu item that activated it
ultags[t].style.left = ultags[t-1].getElementsByTagName("a")[0].offsetWidth + "px"
}
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>
This is the style and the script.. and you can see an exapmle of what it does here:
http://rapidshare.com/files/267332783/css_menue_trail.html
I'm writing in Arabic and I tried to modify this script to suit my style above to make the sub menu appear at the left side of the item... please try it with me please
thanks in advance