<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
.cont{ width: 400px;margin: 200px auto;}
.cont ul li{ margin-top: 20px; border: solid 1px black; text-align: center;line-height: 30px;;}
</style>
</head>
<body>
<div class="cont">
<ul>
<li class='marwrap' ><a href="#"><span class="mar">A4令纸生产线</span></a></li>
<li class='marwrap' ><a href="#"><span class="mar">照明设备</span></a></li>
<li class='marwrap' ><a href="#"><span class="mar">燃气轮机</span></a></li>
<li class='marwrap' ><a href="#"><span class="mar">无人机</span></a></li>
<li class='marwrap' ><a href="#"><span class="mar">防暴车</span></a></li>
<li class='marwrap' ><a href="#"><span class="mar">通信设备</span></a></li>
<li class='marwrap' ><a href="#"><span class="mar">特种车辆</span></a></li>
</ul>
</div>
<script type="text/javascript" src="js/jquery.min.js" ></script>
<script>
$(".cont li a").delegate("span","mouseover",function(){
var content=$(this).html();
$(this).replaceWith("<marquee>"+content+"</marquee>");
});
$(".cont li").delegate("a","mouseout",function(){
var content=$(this).find("marquee").html();
$(this).find("marquee").replaceWith("<span class='mar'>"+content+"</span>");
})
</script>
</body>
</html>
