Question

我正在创建一个简单的jquery幻灯片。当用户点击按钮1时，div框将显示右侧，一个将隐藏左侧的形式。这是我的代码，但是当我点击按钮时，所有div都从右向左移动，但没有一个隐藏左边的形式。

<!DOCTYPE html>
<html>
<head>
    <title></title>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <style>
    .row{
        max-height: 40px;
        overflow: hidden;
        background-color: pink;
    }
    .col-md-4{
        border: 10px solid #eee;
    }
    </style>

</head>
<body>


<div class="container">
<div class="row">
    <div class="col-md-4">gh</div>
    <div class="col-md-4">gh</div>
    <div class="col-md-4">gh</div>
    <div class="col-md-4">gh</div>
    <div class="col-md-4">gh</div>
    <div class="col-md-4">gh</div>
</div>

<button>Click</button>
</div>



<script type="text/javascript">
    $('button').click(function(){
    $(".col-md-4").next().animate({width:'toggle'},2000);
});
</script>


</body>
</html>

Answer 1

我希望这是你想要的（而不是我误解的）

基本上，当您点击div时，以下小提琴会使button显示的消失向左滑动，而右下角则会显示。

Fiddle

此致

Jquery向左滑动按钮

1 个答案: