Question

我目前正在为客户编制网站。她希望她的名字在屏幕中间，当用户点击她的名字时;她希望她的名字像窗帘一样打开并淡出，而图片和菜单则会消失。

她希望她的名字向左移动并淡出;与此同时，她的姓氏向右移动并淡出。

在此之后不久，带有菜单的照片就会淡入。

感谢您提供的任何帮助。

Answer 1

这是一个使用绝对定位的快速而肮脏的第一个版本，虽然我确信你可以使用position: relative来做，但只是为了显示一般的想法（Fiddle）：

$(function(){
    $('div').click(function(){
        $('span.first').animate({
            left: '-=50'
        });

        $('span.second').animate({
            left: '+=50'
        });

        $(this).fadeOut();
    });
})();

HTML：

<html>
<body>
    <div>
        <span class="first">Na</span><span class="second">me</span>
    </div>
</body>
</html>

CSS：

div {
    position:relative;
    background-color: red;

}
span { position: absolute; font-size: 20px;  }
span.first { left: 50px }

span.second{ left: 73px }

你怎么打开窗帘并在jquery中淡出它们？

1 个答案: