zoukankan      html  css  js  c++  java
  • 图片、切换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.

  • 相关阅读:
    C++中整型变量的存储大小和范围
    A1038 Recover the Smallest Number (30 分)
    A1067 Sort with Swap(0, i) (25 分)
    A1037 Magic Coupon (25 分)
    A1033 To Fill or Not to Fill (25 分)
    A1070 Mooncake (25 分)
    js 获取控件
    C#代码对SQL数据库添加表或者视图
    JS 动态操作表格
    jQuery取得下拉框选择的文本与值
  • 原文地址:https://www.cnblogs.com/jiangu66/p/3024885.html
Copyright © 2011-2022 走看看