Simple -webkit-transform demo

by rpflorence

HTML

<button id=button>toggle class</button>​
<div id=demo></div>​

CSS

#demo {
    font-family: helvetica, arial;
    margin-top: 10px;
    position: relative;
    left: 0;
    width: 100px;
    height: 100px;
    background: #ccc;
    
    -webkit-transition: -webkit-transform 1s ease-out;
}

#demo.nudged {
    -webkit-transform: translateX(30%);
}

JavaScript

$('button').addEvent('click', function() {
    $('demo').toggleClass('nudged');
});