<!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> new document </title>

  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

  <meta name="author" content="" />

  <meta name="keywords" content="" />

  <meta name="description" content="" />

  <link rel="stylesheet" type="text/css" href="" />

  <style type="text/css"></style>

  <script type="text/javascript">

    window.onload=init;

    var n=1; //图片标记数

    var dingshi; //让图片动的定时器

    function init(){

        dingshi=window.setInterval("tupian()",1000);

    }

    //更换图片

    function tupian(){

        var obj=document.getElementById("img1");

        n++;

        if(n>=4){

            n=1;

        }

        obj.src="yaj_"+n+".jpg";

    }

    //鼠标放上图片停止

    function stoptupian(){

        window.clearInterval(dingshi);

    }

    //鼠标离开图片动起来

    function dongqilai(){

        dingshi=window.setInterval("tupian()",1000);

    }

  </script>

 </head>

 <body>

  <img src="yaj_1.jpg" onmouseover="stoptupian()"  onmouseout="dongqilai()" id="img1">

 </body>

</html>

js自动切换图片的更多相关文章

  1. Android中仿淘宝首页顶部滚动自定义HorizontalScrollView定时水平自动切换图片

    Android中仿淘宝首页顶部滚动自定义HorizontalScrollView定时水平自动切换图片 自定义ADPager 自定义水平滚动的ScrollView效仿ViewPager 当遇到要在Vie ...

  2. js多种切换图片

    分享通过js实现多种图片切换特效,这里只有手动切换哦,自动效果需自写,效果地址:http://dwz.cn/1drD5u. 下载地址:http://***/download/index/52209 适 ...

  3. JQury自动切换图片

    [标签]Jquery图片自动切换<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "ht ...

  4. 《ASP.NET1200例》高亮显示ListView中的数据行并自动切换图片

    aspx <script type="text/javascript"> var oldColor; function SetNewColor(Source) { ol ...

  5. js 循环切换图片

    function changeLot(){ var minIndex = 1; var maxIndex = 100; var curIndex = 10; var src = $("ul ...

  6. js动态切换图片

    <script language =javascript > $(function () { initAds(); }); function initAds() { var curInde ...

  7. js 数组切换图片

    <html> <head> <meta charset="utf-8" /> <title></title> <s ...

  8. js 上下切换图片

    <html><head lang="en"> <meta charset="UTF-8"> <title>< ...

  9. 原生js+css3实现图片自动切换，图片轮播

    运用CSS3transition及opacity属性 制作图片轮播动画 自己这两天根据用js来控制触发CSS3中transition属性,从而写出来的以CSS3动画为基础,js控制过程的图片轮播 运用 ...

随机推荐

  1. CSS3 特效分解一

    先声明下,下面的特效不是我发明的,对CSS3的创造力还不够,只是看了别人demo的源码,一点一点分析出来的.整理出的笔记,分享给大家.因为源码是好,但是一头扎进去半天出不来. 首先看个登陆框,如下,相 ...

  2. delegate、notification、KVO场景差别

    delegate: 编译器会给出没有实现代理方法的警告 一对一 使用weak而不是assign,或者vc消失时置为nil 可以传递参数,还可以接收返回值 notification: 编译期无法排错 一 ...

  3. 深圳本土web前端经验交流

    群号:125776555  深圳本土web前端技术交流群 baidu tencent前端拒绝垃圾广告.吹水,欢迎讨论技术.跳槽经验期待您的加入 

  4. 前端构建工具gulpjs的使用介绍及技巧

    gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简单,学习起来很容易,而且gulpjs使用的是nodejs中stream来读取和操作数据,其速 ...

  5. 轻量级Java EE企业应用实战（第4版）：Struts 2+Spring 4+Hibernate整合开发(含CD光盘1张)

    轻量级Java EE企业应用实战(第4版):Struts 2+Spring 4+Hibernate整合开发(含CD光盘1张)(国家级奖项获奖作品升级版,四版累计印刷27次发行量超10万册的轻量级Jav ...

  6. Laravel 5.3 请求处理管道详解

    对于一个Web应用来说,在一个请求真正处理前,我们可能会对请求做各种各样的判断,然后才允许后续处理. 我们通常的做法: Script 01.php Script 02.php 优点:直观,容易理解 缺 ...

  7. JS原生第六篇 （帅哥）

    复习 按钮不可用    disabled =  "disabled"  ||  true setTimeout   只执行一次    setInterval  执行很多次 递归调用 ...

  8. 获取URL最后一个 ‘/’ 之后的字符

    在开发项目的过程中,经常遇到需要解析论坛,博客等的URL的问题,比如:'abc/def/jkl' 或 'abc/def/jkl/',获取最后一个‘/’之后的所有字符‘jkl’,由于特殊字符'/'的个数 ...

  9. (App.Current.RootVisual as PhoneApplicationFrame).Navigate(new Uri("/MainPage.xaml", UriKind.Relative));

    (App.Current.RootVisual as PhoneApplicationFrame).Navigate(new Uri("/MainPage.xaml", UriKi ...

  10. [转]用C/C++扩展PHP详解

    原文:http://www.imsiren.com/archives/547 一个简单的扩展模块 PHP非常容易扩展,因为它提供了我们想用的所有API. 如果要新建一个扩展,需要在PHP源码中执行ex ...