css控制背景图左右对齐 实现鼠标移入移出效果

 

1. 新建DIV 并设置大小

 

2. 选择背景图片，并设置为平铺
     background-image: url(../Images/Test.jpg);
     background-repeat: repeat;

 

3. 新建式样 分别对应鼠标移入层和鼠标移出层时的状态
     .sIn{ background-position-x: left;}
     .sOut{ background-position-x: right;}

 

4. 将样式写入DIV的鼠标事件
 onmousemove="this.className='sIn'"
 onmouseout="this.className='sOut'"