marquee元素实现滚动字体图片滑动等效果

<style type="text/css">
#div01{
width: 500px;
}
</style>
<script type="text/javascript">
</script>
<marquee behavior="alertnate"><font size=30 color='red'>.baidu.111</font></marquee>
<marquee direction=right bgcolor='#ff2233' behavior="alertnate"><font size=30 color='blue'>.baidu.222</font></marquee>
<marquee id="m3" direction=down bgcolor='#dbdbdb' height=50px hspace=20px vspace=20px behavior="alertnate" scrollLeft=left onmouseover="this.s()" onmouseout="this.start()"><font size=30 color='blue'>.baidu333.</font></marquee>
<marquee id="m4" direction=up bgcolor='#00dbdb' behavior="alertnate"><font size=30 color='blue'>.baidu444.</font></marquee>



<div id="div01"><marquee direction=right bgcolor='#ff2233' behavior="alertnate" scrolldelay=100><font size=30 color='blue'>.baidu.555</font></marquee></div>
<input type="button" onclick="m3.s();" value="m3.s"></input>
<input type="button" onclick="m3.start();" value="m3.start"></input>
<button onclick="m4.s();">m4.s</button>
<button onclick="m4.start();">m4.start</button>

<input type="button" onclick="m3.s();" value="m3.s"></input>
<input type="button" onclick="m3.start();" value="m3.start"></input>
<button onclick="m4.s();">m4.s</button>
<button onclick="m4.start();">m4.start</button>