1

所以我做了一些搜索，但没有找到我的问题的答案。

我的页面左侧有一个“反馈”菜单，我希望该“反馈”链接与反馈 div 一起滑动。

取而代之的是，链接只是被推开。

这是我现在所做的 jsFiddle。

$(document).ready(function(){
$("#feedback-titre").click(function(){
    $("#feedback-commentaire").toggle("slide");
});
});

CSS：

    #menu-leftfeedback{
    position: fixed;
    left: 0px;
    top: 250px;
}

#feedback-titre{
    float:left;
    background-color:#FFF;
    color:#000;
    font-weight:bold;
    border-radius: 5px 5px 0px 0px;
    border:solid 1px #9C8E69;
    border-bottom:0px;
    cursor:pointer;
    display:block;
    width:100px;
    height:30px;
    font-size:large;
    -webkit-transform: rotate(90deg);
    -webkit-transform-origin: bottom left;
    -moz-transform: rotate(90deg);
    -moz-transform-origin: bottom left;
    -ms-transform: rotate(90deg);
    -ms-transform-origin: bottom left;
    -o-transform: rotate(90deg);
    -o-transform-origin: bottom left;
    transform: rotate(90deg);
    transform-origin: bottom left;
}

#feedback-commentaire{
    float:left;
    background-color:cyan;
    display:none;
    width:300px;
    height:330px;
}

#feedback-commentaire input, #feedback-commentaire textarea{
    width:290px;
    border: medium none;
    color: #7B7B7B;
    font-size: 18px;
    height: 38px;
    padding: 2px 10px 2px 7px;
}

#feedback-commentaire button{
    background-color:transparent;
    border:0;
    color:#D42E00;      
}

我的猜测：它是 CSS，但我尝试了很多东西都没有成功。我变成你来帮助我。

4

1 回答 1

1

这是我如何让它工作的：

CSS

#menu-leftfeedback{
    position: fixed;
    left: -300px;
    top: 250px;
}

#feedback-commentaire{
    float:left;
    background-color:cyan;
    /*XXXXXXX REMOVED XXXXXXX display:none;*/
    width:300px;
    height:330px;
}

JS

var feedbackButton = $("#feedback-titre"),
    feedbackContent = feedbackButton.parent();

feedbackButton.click(function(){
    feedbackContent.animate({
        left: parseInt(feedbackContent.css('left'),10) == 0 ? -feedbackContent.outerWidth() + feedbackButton.outerWidth() : 0
    }, 500);
});

演示

http://jsfiddle.net/66aa7/110/

于 2013-02-08T10:15:43.427 回答