图片、切换-js实现图片轮换效果-by小雨

本篇文章是一篇关于图片、切换-的帖子

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head>

    <title></title>

    <script type="text/javascript">

        var numb = 0;

        var imgnumb = 1;

        

        function showimg() {

         //两张图片切换法方1   /*numb++;

            if (numb % 2 == 0) {

                document.getElementById('img1').setAttribute('src', 'images/1.jpg');

            }

            else {

                document.getElementById('img1').setAttribute('src', 'images/2.jpg');

            }*/

        

                  

         //两张图片切换法方2   /*if (numb == 0) {

                document.getElementById('img1').setAttribute('src', 'images/2.jpg');

                numb = 1;

            }

            else {

                document.getElementById('img1').setAttribute('src', 'images/1.jpg');

                numb = 0;

            }*/

        }

       /图片轮换/多张 function imgfor() {            

            imgnumb++;

            document.getElementById('img1').setAttribute('src', 'images/' + imgnumb + '.jpg');

            if (imgnumb == 9) {

                imgnumb = 0;

            }

        }

        var clearid;

        function clearfun() {

            clearInterval(clearid);

        }

        clearid=setInterval(imgfor, 1000);

    </script>

    </head>

    <body>

    <img alt="" id="img1" class="style1" src="images/1.jpg" width="500px" height="500px" />

    <input type="button" value="两张图片切换" onclick="showimg();" />

    <br />

    <input type="button" value="多张图片轮换" onclick="imgfor();;" />

    <br />

    <input type="button" value="结束执行" onclick="clearfun();" />

    </body>

    </html>

文章结束给大家分享下程序员的一些笑话语录: 某程序员对书法十分感兴趣,退休后决定在这方面有所建树。花重金购买了上等的文房四宝。一日突生雅兴,一番磨墨拟纸,并点上了上好的檀香,颇有王羲之风 范,又具颜真卿气势,定神片刻,泼墨挥毫,郑重地写下一行字:hello world.

posted @ 2013-04-16 21:09  坚固66  阅读(207)  评论(0编辑  收藏  举报