< Retour

Shine

.shine {
    position: absolute;
    width: 200px;
    height: 50px;
    top: 100px;
    left: 50px;
    border-radius: 5px;
    -webkit-transition: all 1s ease-in-out;
            transition: all 1s ease-in-out;

    background-image: -webkit-linear-gradient(left,     rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0));
    background-image:         linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0));
    background-repeat: no-repeat;
    background-position: -200px 0;
}

.shine.tween {
    background-position: 200px 0;
}