Inward wipe

by hellosze

HTML

<div class="c">

<div class="l-c">
<div class="c-left">
left
</div>
</div>
    
<div class="r-c">
<div class="c-right">
right
</div>
</div>
    
</div>

CSS

.c { width: 100px; height: 100px }
.l-c,.r-c { overflow: hidden; width: 50px; }
.c-left { float: left; width: 50px; }
.c-right { float: right; width: 50px; }

JavaScript

$(".c").click(function(){
    //alert("hi");
    $(".hello").css("background","#fff").css("color","#000");
    $(".hello").animate({"padding-left":"200px"},2800); 
   
    
});