<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script type="text/javascript">

            function init(){

                setInterval("changelunbo()",1000);

            }

            var i = 1;

            function changelunbo(){

                i++;

                var imgE = document.getElementById("lunbo");

                imgE.src = "img/2."+i+".jpg";

                if(i == 4){

                    i = 0;

                }

            }

        </script>

    </head>

    <body onload="init()">

        <img src="img/2.1.jpg"/ id="lunbo">

    </body>

</html>

js实现简单的轮播效果的更多相关文章

  1. JS实现焦点图轮播效果

    大家平时逛淘宝网的时候,在首页就能看到焦点图轮播的效果,就是这个样子的: PS:想起每每打开淘宝,总会被这个玩意先夺眼球,偶尔还去点进去溜溜,幸好我定力好,总能控制住自己的购买欲望,为自己不用剁手感到 ...

  2. JS实现小图放大轮播效果

    JS实现小图放大轮播页面效果入下(图片为优行商旅页面照片): 实现效果:图片自动轮播,鼠标移入停止,移出继续轮播点击下方小图可以实现切换 步骤一:建立HTML布局,具体如下: <body> ...

  3. 通过jquery js 实现幻灯片切换轮播效果

    观察各个电商网址轮播图的效果,总结了一下主要突破点与难点 1.->封装函数的步骤与具体实现 2->this关键字的指向 3->jquery js函数熟练运用 如animate 4-& ...

  4. JS框架_(Bootstrap.js)实现简单的轮播图

    Bootstrap框架中 轮播(Carousel)插件是一种灵活的响应式的向站点添加滑块的方式 轮播图效果: <!DOCTYPE html> <html> <head&g ...

  5. jquery简单的轮播效果！

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  6. js插件-图片椭圆轮播效果

    插件效果图: html 代码如下: <div id="container"> <img src="images/cartoon/1.jpg" ...

  7. 针对淡入淡出的定时轮播效果js

    如果不使用jquery的fadeIn和fadeOut的接口和不适用animate情况下,如果要做用js实现淡入淡出轮播效果,我所想到的办法就是使用css3新特性transition(注意好兼容性). ...

  8. JS、JQ实现焦点图轮播效果

    JS实现焦点图轮播效果 效果图: 代码如下,复制即可使用: (不过里面的图片路径需要自己改成自己的图片路径,否则是没有图片显示的哦) <!DOCTYPE html> <html> ...

  9. Jquery实现左右轮播效果

    首先展示下静态布局h5代码,代码非常简单. <div id="slide"> <ul class="pic-list"> <li& ...

随机推荐

  1. GitLab的安装及使用教程

    1.配置yum源 vim /etc/yum.repos.d/gitlab-ce.repo 复制以下内容: [gitlab-ce] name=gitlab-ce baseurl=http://mirro ...

  2. android应用中去android市场去评分的功能实现（吐槽一波个人应用上线...）

    一般的app可能会有这中功能,在应用中去android商店评分来提高排名,前段时间也把我的博客园上传到商店,这里不得不吐槽一些android商店的开放平台. 酷派,vivo,oppo,联想不支持个人开 ...

  3. spring 组件@Scope(request,session)示例

    上回说到, spring组件的注解Scope大约有singleton.prototype.request.session.global session 这么几种常用的场景.这里需要特别说明一下,根据源 ...

  4. centos/linux下的使得maven/tomcat能在普通用户是使用

    以下操作#代表在root用户下使用 $表示在普通用户下使用 1.创建新用户 # useradd lonecloud 2.设置该用户的密码 # passwd lonecloud 3.因为昨天将tomca ...

  5. 解决mac 中的myeclipse控制台中文乱码问题

    http://www.myexception.cn/eclipse/1742588.html 解决 http://my.oschina.net/u/555006/blog/195013

  6. PHP秒杀系统全方位设计（二）

    商品页面开发 静态化展示页面[效率要比动态PHP高很多,PHP程序需要解析等步骤,本身就需要很多流程,整个下来PHP的处理花的时间和资源要多] 商品状态的控制 开始前.进行中.库存不足.结束 数据逻辑 ...

  7. Win10 部署 依赖 NET3.5 项目，报错 无法安装 NET3.5 ，该如何解决？

    下载 NetFx3.cab Cab 安装包 拷贝 NetFx3.cab 文件至 C:\Windows 目录 打开命令行窗口(管理员权限) 输入以下内容: dism /online /Enable-Fe ...

  8. python数据可视化学习1

    import matplotlib.pyplot as plt input_values = [1,2,3,4,5] #输入值 squares = [1,4,9,16,25] #输出值 plt.plo ...

  9. SpaceNet数据集

    SpaceNet数据集 SpaceNet是DigitalGlobe商业卫星公司提供的遥感图像集合,包含一些标记信息可用作机器学习研究. SpaceNet Challenge主页: https://sp ...

  10. ui设计未来前景怎么样？ui设计这个行业怎么样？

    千锋UI设计师培训不仅有正常的培训课程,还为学员提供了UI+产品经理周末提升班,目的是为了给那些有基础的UI设计师提高能力.今天要为大家说的是一位千锋UI设计师的故事. 大家好,我是千锋UI设计培训部 ...