02-12作业1缩略图

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
            <img id = 'img11' src="img/picture-1.jpg" alt="" />
        <div id = 'div2'>
            <img id = 'img1' src="img/thumb-1.jpg" alt="" />
            <img id = 'img2' src="img/thumb-2.jpg" alt="" />
            <img id = 'img3' src="img/thumb-3.jpg" alt="" />
        </div>
    </body>
</html>
<script type="text/javascript">
    imgNode11 = document.getElementById('img11')
    
    imgNode1 = document.getElementById('img1')
    imgNode2 = document.getElementById('img2')
    imgNode3 = document.getElementById('img3')  
    imgs = ['picture-1.jpg','picture-2.jpg','picture-3.jpg']    
    
    imgNode1.onmouseover = function(){
        imgNode11.src = 'img/'+imgs[0] 
    }
    imgNode2.onmouseover = function(){
        imgNode11.src = 'img/'+imgs[1] 
    }
    imgNode3.onmouseover = function(){
        imgNode11.src = 'img/'+imgs[2] 
    }   
</script>

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容