首页 >web前端 >js教程 >js动态切换图片的方法_javascript技巧

js动态切换图片的方法_javascript技巧

WBOY
WBOY原创
2016-05-16 16:19:071266浏览

本文实例讲述了js动态切换图片的方法。分享给大家供大家参考。具体实现方法如下:

index.css文件如下:

复制代码 代码如下:
* { 
    margin: 0px;padding: 0px; 

 
body { 
    width: 632px; 
    /*background-color: blue;*/ 
    margin: 0 auto; 

 
#imgsCom { 
    background-color: yellow; 
    /*相对定位,为了下层可以使用绝对定位时以本div的原点为原点*/ 
    position: relative; 

 
#ulnav{ 
    list-style-type: none; 
    
    position: absolute; 
    /*使用以imgsCom为原点来绝对定位到右下角*/ 
    bottom: 0px; 
    right: 0px; 

#ulnav li{ 
    list-style-type: none; 
    float: left; 
    background-color: black; 
    color: white; 
    margin-right: 5px; 
    width: 20px; 
    height: 20px; 
    line-height: 20px; 
    text-align: center; 
    cursor: pointer; 
}

index.html如下:

复制代码 代码如下:
 
 
 
     
    js,css动态切换图片 
     
     
 
 
   
 
        js动态切换图片的方法_javascript技巧 
       
     
               
  • 1
  •  
               
  • 2
  •  
               
  • 3
  •  
           
 
   
 
 

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

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn