<script type="text/javascript">
var headerArea_img_index = 0;
$(document).ready(function(){
setInterval(function(){
$(".headerArea img:visible").hide();
$(".headerArea img:eq(" + headerArea_img_index + ")").show();
headerArea_img_index = (headerArea_img_index+1) % $(".headerArea img").size();
}, 3000);
$(".headerArea img:eq(" + headerArea_img_index + ")").show();
});
</script>
<header class="headerArea">
<img src="header01.png" />
<img src="header02.png" />
<img src="header03.png" />
<img src="header04.png" />
</header>