0

我正在尝试解决滑动垂直菜单的问题，当我在它上方时，菜单标题会向右移动。

过去的时候你可以自己在这里portfolio看到。

这是我目前使用的 CSS：

#menu {
    position: absolute;
    top: 60px;
    right: 20px;
    height: 80%;
    color: #ffffff;
    cursor: default;
    letter-spacing:8px;
}

#menu li {
    list-style: none;
    cursor: pointer;
    letter-spacing:1px;
}

#menu-portfolio {
    float: left;
    border-right: 2px solid; 
    padding-right: 0.3em;
    font-size: 95%;
}

.menu-gallery-selector {
    font-size: 85%;
    text-align:left;
    margin:5%;
}

.menu-gallery-selector:nth-of-type(1) {
    margin-top:15%;
}

#menu-contact {
    float: left;
    letter-spacing:1px;
    padding-left: 0.4em;
    font-size: 95%;
}

这是javascript：

$("#menu-portfolio").bind("mouseover", expand);
$("#menu-portfolio").bind("mouseout",collapse);
$(".menu-gallery-selector").hide();


function collapse() {
    $(".menu-gallery-selector").hide();
}

function expand() {
    $(".menu-gallery-selector").show();
}
4

3 回答 3

1

您可以通过添加text-align: right;到

#menu-portfolio {
    float: left;
    border-right: 2px solid #000;
    padding-right: 0.3em;
    font-size: 95%;
    text-align: right;
}

应该做的工作

于 2013-04-27T15:17:46.530 回答
1

当我对此进行测试时，“投资组合”文本向左移动而不是向右移动。“投资组合”文本移动的原因是因为最宽列表项“汽车”的文本扩大了<ul>包含“投资组合”文本的标签的宽度。您需要添加text-align: right;投资组合文本。

于 2013-04-27T15:17:52.840 回答
1

简单修复

#menu-portfolio {
text-align:right;
}
于 2013-04-27T15:14:08.113 回答