Jquery Slidedown将其他div移动

时间:2013-05-23 06:16:23

标签: jquery css slideup

我试图用css定位div绝对值。我有2个div我在使用jquery向下滑动并向上滑动。如果一个div向下滑动,其他div也会受到此代码here的干扰。

当一个鼠标悬停在第一个div上时,可能会有人建议我停止第二个div滑动,反之亦然。

2 个答案:

答案 0 :(得分:2)

请查看http://jsfiddle.net/K2ndZ/3/

我仅在.combobox {cursor:pointer;float:left; margin-left:10px;}

中进行了更改

答案 1 :(得分:1)

点击此处链接http://jsfiddle.net/sarfarazdesigner/K2ndZ/5/ 为此你必须改变你的一些代码 这是css

.combobox {cursor:pointer;display:inline-block; position:relative;}
.combobox .selector {position:relative; float:left; }
.combobox .selector p{border:1px solid #cccccc;padding: 2px 5px;}
.combobox ul {padding:0;margin:0;display:inline-block;border:1px solid #eeeeee;background-color:#cccccc;}
.combobox li {padding: 2px 5px}

这是html

<div class="combobox">
    <div class="selector">
        <p>Please select</p>
        <ul>
            <li>Option 1</li>
            <li>Option 2</li>
            <li>Option 3</li>
        </ul>
    </div>


    <div class="selector">
        <p>Please select</p>
        <ul>
            <li>Option 1</li>
            <li>Option 2</li>
            <li>Option 3</li>
        </ul>
    </div>
</div>

,这是jQuery部分

$(document).ready(function(){
    $('.combobox ul').hide();
    $('.combobox p').hover(
        function(){
            console.log(this);
            $(this).next('ul').stop().slideDown();
        },
        function(){
            $(this).next('ul').stop().slideUp();
        }
    );
    $('.combobox li').click(function(){
        $(this).parents('.combobox').find('.selector').text($(this).text());
    });
});

根据您的更新链接

http://jsfiddle.net/sarfarazdesigner/K2ndZ/7/