关闭

javascript实现图片滚动效果

标签: javascriptfunctionimage脚本html
1715人阅读 评论(1) 收藏 举报
           window.onload = rolloverInit;
           
//加载窗体时触发事件
                                          
        
function rolloverInit(){
            
for (var i=0; i<document.images.length; i++){
                
if(document.images[i].parentNode.tagName=="A"){
                    setupRollover(document.images[i]);
                }

            }

        }

        
//对所有包含超级连接的图片执行滚动设置


        
function setupRollover(thisImage){
            thisImage.outImage 
= new Image();
            thisImage.outImage.src 
= thisImage.src;
            thisImage.onmouseout 
= rollOut;

            thisImage.overImage 
= new Image();
            thisImage.overImage.src 
= thisImage.id + "_on.jpg";
            thisImage.onmouseover 
= rollOver;
        }

        
//为图片设置了out和over两种模式和相应的图片,可根据需要实际添加或修改


        
function rollOver(){
            
this.src = this.overImage.src;
        }

        
        
function rollOut(){
            
this.src = this.outImage.src;
        }

 相应在HTML中要对脚本进行引用,同时需要滚动效果的图片应包含在超连接<a herf="..."></a>中

 

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:30058次
    • 积分:329
    • 等级:
    • 排名:千里之外
    • 原创:4篇
    • 转载:3篇
    • 译文:0篇
    • 评论:6条
    文章存档
    最新评论