Question

does any one know how to make the slide to left effect like in the “Read it Later” app with CSS3 or JS?

onclick –> slide whole div to left and show the div under the one which slides away.

here is an video with the example: READ IT LATER

Answer 1

May be that’s you want with css3.
CSS

.parent{
    width:300px;
    border:1px solid red;
    height:100px;
    position:relative;
}
.box{
    width:40px;
    height:40px;
    background:green;
    display:block;
    z-index:0;
}
.slider{
    width:300px;
    background:#454545;
    color:#fff;
    font-weight:bold;
    font-size:24px;
    height:100px;
    position:absolute;
    top:0;
    right:300px;
    transition: right 1s ease;
    -moz-transition: right 1s ease; /* Firefox 4 */
    -webkit-transition:right 1s ease; /* Safari and Chrome */
    -o-transition:right 1s ease; /* Opera */
    z-index:1;
}
.box:focus + .slider,.box:active + .slider{
    right:0;
}

HTML

<div class="parent">
    <a href="#" class="box"></a>
    <div class="slider">hello</div>
</div>

Check this http://jsfiddle.net/MhHx2/

UPDATED

http://jsfiddle.net/MhHx2/4/