Question

假设我有一个占据屏幕宽度的任务列表。当我点击其中一个时，它向左滑动以占据屏幕的50％，并且同时从屏幕右侧滑动有关所点击任务的一些细节。这个“细节卡”也将占据屏幕的一半。总而言之，我想模仿wunderlist效果。所以我写了这个fiddle，但它运作不顺利。有人可以帮忙吗？

Answer 1

给出适当的宽度，位置。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<STYLE>
#content {
    background-color:#6688ff;
    position:absolute;
    width:100px;
    height:100px;
    padding:3px;
    margin-top:5px;
    left: 100px;
}
</STYLE>
<input type="button" id="left" value="Left"/>
<input type="button" id="right" value="Right"/>
<div id="content">Move</div>
  <script>
$(document).ready(function(){
$("#right").click(function() {
    $("#content").animate(
            {"left": "+=50px"},
            "slow");
});
$("#left").click(function() {
    $("#content").animate(
            {"left": "-=50px"},
            "slow");
});
        });     
</script>

向右和向左滑动 - jquery

1 个答案: