Question

请看这个脚本：

<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>

这是样式和脚本..你可以看到它在这里的作用的一个例子：

http://rapidshare.com/files/267332783/css_menue_trail.html

我正在用阿拉伯语写作，我尝试修改这个脚本以适应我上面的风格，使子菜单显示在项目的左侧...请与我一起试试

提前致谢

Answer 1

在css和javascript代码中替换“left”width“right”，然后将dir =“rtl”添加到html-tag。您的标题应如下所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html dir="rtl" xmlns="http://www.w3.org/1999/xhtml" xml:lang="ar" lang="ar">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  ...
</head>

这似乎对我有用，但后来我不知道任何阿拉伯语： - ）

以下是修改后的版本：css_menue_trail_arabic.html

给定此脚本，如何将子菜单放在主菜单的左侧？

1 个答案: