首页 > Web开发 > 详细

js——js特效

时间:2020-05-22 22:19:31      阅读:55      评论:0      收藏:0      [点我收藏+]

图片切换效果

<body>
        <div id="box">
            <img src="image/image1.jpg"  id="tu">
        </div>
        <button  id="prev">上一页</button>
        <button  id="next">下一页</button>

    </body>

js

main = function(){
    //获取节点
    var tu = document.getElementById("tu");
    var next = document.getElementById(‘next‘);
    var prev = document.getElementById(‘prev‘);
    
    var min=1,max=4,cont = min;
    next.onclick = function(){
        cont++;
        if(cont>max)
        {
            cont = min;
        }
        console.log(‘image/image‘+cont+‘.jpg‘);
            tu.setAttribute(‘src‘,‘image/image‘+cont+‘.jpg‘);
        
        
    }
    prev.onclick = function(){
        cont--;
        if(cont<min)
        {
            cont = max;
        }
        console.log(‘image/image‘+cont+‘.jpg‘);
            tu.setAttribute(‘src‘,‘image/image‘+cont+‘.jpg‘);
        
        
    }
    
}

window.onload = main;

 

js——js特效

原文:https://www.cnblogs.com/wocaonidaye/p/12939923.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!