-2

我正在做一个下拉菜单,其中有 2 个文本框和按钮。我在网站顶部有一个按钮。当有人点击一个 div 正在向下滑动时。我做了这么多。我需要知道如何使用 div 的幻灯片来按下该按钮..请帮助我..

这是我用于向下滑动 div 的 jquery 代码

       $('.link_sign_in').click(function(){

                var left=$('.link_sign_in').position().left;
                var top=$('.link_sign_in').position().top;

                $(".drop_down").css("left",left-235);
                $(".drop_down").css("top",0);
                $('.drop_down').slideDown();

                });

下拉框的下拉框的css

.drop_down{
        background-color: #ffffff;
        -webkit-border-bottom-right-radius: 5px;
        -webkit-border-bottom-left-radius: 5px;
        -moz-border-radius-bottomright: 5px;
        -moz-border-radius-bottomleft: 5px;
        border-bottom-right-radius: 5px;
        border-bottom-left-radius: 5px;
        height: 200px;
        width: 300px;
        z-index:100;
        top :200px;
        left:200px;
        position: absolute;
        border: 2px solid #F8C82A;


        -webkit-box-shadow: 0px 8px 15px rgba(50, 50, 50, 0.5);
        -moz-box-shadow:    0px 8px 15px rgba(50, 50, 50, 0.5);
        box-shadow:         0px 8px 15px rgba(50, 50, 50, 0.5);

        border-top: none;
        }

代码关闭登录div

.link_sign_in,.link_sign_up{
        cursor:pointer;
        float:left; 
        width:50px;
        margin-left:5px;
        border: 2px solid #f8c82a;
        padding:5px;
        -webkit-border-bottom-right-radius: 5px;
        -webkit-border-bottom-left-radius: 5px;
        -moz-border-radius-bottomright: 5px;
        -moz-border-radius-bottomleft: 5px;
        border-bottom-right-radius: 5px;
        border-bottom-left-radius: 5px;
        border-top: none;

        -webkit-box-shadow: 0px 8px 15px rgba(50, 50, 50, 0.5);
        -moz-box-shadow:    0px 8px 15px rgba(50, 50, 50, 0.5);
        box-shadow:         0px 8px 15px rgba(50, 50, 50, 0.5);
        }
4

1 回答 1

0

添加* { position:relative;}到 CSS 文档的顶部。这将导致所有页面元素都相对于它们的父元素,这会覆盖某些浏览器的默认行为。然后,确保该按钮实际上是一个容器的 CHILD,其中包含要向下滑动的 div 和按钮。然后,使用left:20px;或其他测量值(使用topbottomright如果需要)将按钮定位在您想要的位置。然后,当您向下“滑动” div 时,将幻灯片应用于包含您的按钮和滑动 div 的容器 div。这样,按钮和 div 都将向下滑动,并且按钮将保持在您希望它相对于滑动 div 的位置。

于 2012-09-27T10:12:56.483 回答