JS实现的车标图片提示效果代码

本文实例讲述了JS实现的车标图片提示效果。分享给大家供大家参考。具体如下：

这是一款基于Javascript的鼠标提示效果，名车车标展示提示效果-鼠标移过时显示车标图片，页面打开后并不显示车标，只有当鼠标移在车标上的时候，车标才突然出现，类似Js提示特效，本代码兼容性也写的不错，代码也并不复杂，大部分是调用图片的。

运行效果截图如下：

在线演示地址如下：

http://demo.jb51.net/js/2015/js-car-ico-alert-style-demo/

具体代码如下：

 
body,div,h2,ul,li{margin:0;padding:0;}
body{font:12px/1.5 Tahoma;}
ul{list-style-type:none;}
#outer{width:560px;border:1px solid #333;margin:10px auto;padding:0 0 10px 10px;}
#outer h2{line-height:30px;text-align:center;margin-top:10px;}
#outer ul:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
#outer ul{zoom:1;}
#outer ul li{position:relative;float:left;border:1px solid #333;margin:10px 10px 0 0;display:inline;}
#outer ul li img{position:absolute;top:-14px;left:-14px;display:none;border:2px solid #999;cursor:crosshair;}
#outer ul li a{color:#666;width:80px;height:80px;display:block;background:#f0f0f0;text-decoration:none;padding:10px;}
#outer ul li a strong{display:block;}
.zindex{z-index:1;}





 名车车标展示-鼠标移过显示车标
 

 

  BMW宝马汽车
  
 
 

  Alfa Romeo 阿尔法-罗米欧
  
 
 

  Skoda 斯柯达
  
 
 

  Volkswagen 大众汽车
  
 
 

  Saab 萨布牌轿车
  
 
 

  Lamborghini 兰博基尼
  
 
 

  Porsche 保时捷
  
 
 

  Peugeot 标致
  
 
 

  Mercedes1 梅赛德斯 奔驰
  
 
 

  Buick 别克汽车
  
 
 

希望本文所述对大家的Javascript程序设计有所帮助。