jsFiddle

• Run again
• Edit this fiddle

• JavaScript
• HTML
• CSS
• Result

window.addEvent('domready', function(){

  $$('li').each(function(li){
    li.addEvent('mouseenter', function(){  
      li.tween('padding-left', 20);
    }).addEvent('mouseleave', function(){
      li.tween('padding-left', 0);
    });
  });

});

<ul>
    <li>Snake man</li>
    <li>Gemini man</li>
    <li>Shadow man</li>
    <li>Spark man</li>
</ul>

/* irrelevant */

li {
    cursor: pointer;
}

body {
    font-family: helvetica;
}