`

定时更换图片的桌面背景 html页面

阅读更多

1.准备相关图片(1.jpg,2.jpg...n.jgp)
2.编写一个html页面 用以显示图片
          并设置为自动定时更新图片
3.将改html页面 设置为桌面背景
          该“桌面”隔定时自动刷新 更新图片显示
===============================================
1.将自己需要的图片 如英语小卡片 名人名言等
  集结在一个文件夹下 并进行命名 如1.jpg,2.jpg...
  这样在最后的桌面上 就可以学习英语或名言了

2.编写如下示例的html页面 放在该图片文件夹中
  假设该html页面 名称为myPicDesktop.html
 
  其中之所以设置td的宽度为50%
  是想控件图片的显示位置在桌面的右半部
  因为通常桌面的左半部都有很多图标

示例代码如下:

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

</head>
<script language="javascript">

window.onload=refleshDesktopPic

function refleshDesktopPic()
{ 
   var i = 1;
   var j = 0;          //图片的顺序号
   var k = 3;          //图片的张数
   var m = 2*1000;    //每张显示的时间 毫秒
   var n = 2;          //循环遍数
   //
   while(i<=(n*k))
   {
      j= i%k;//应该循环第几张图片以显示
      
      if(j==0)
        j=k;//最后一张图片的序号

      //隔一短时间后 再替换为另一张图片
      setTimeout("setPic("+j+")",(m*i) ); 

      i = i+1; 
   }
}

function setPic(picSeqNum)
{   
   document.all.myDiv.innerHTML = "<image id='image2' src='"+picSeqNum+".jpg'></image>";
}

</script>
<body>
<table width="100%">
  <tr>
    <td width="50%">
    </td>
    <td>
      <div id="myDiv"> 
         <image id="image1" src="1.jpg"></image>
      </div>
    </td>
 </tr>
</table>
</body>
</html>

 

 其他方法:

<body onload='setInterval("changeBG()",1000)'>
 <script>
 function changeBG()
 {
   //随机显示pic1……pic9十张背景图.
   document.body.background="pic"+(Math.floor(Math.random()*9+1)+".jpg"));
 }
 </script>

 

 

其他方法2:

<body onload='setInterval("changeBG()",1000)'>
 <script>
 //对图片进行预载.
var arr = new Array();
 for(var i=1;i<10;i++)
 {
     arr[i] = new Image();
     arr[i].src = "pic" + i + ".jpg";
 }
 function changeBG()
 {
   document.body.background="pic"+(Math.floor(Math.random()*9+1)+".jpg"));
 }
 </script>

 

 

分享到:
评论

相关推荐

    很漂亮得桌面背景javascript

    同时,我们还可以使用定时器(`setInterval`或`setTimeout`)来定期更换背景图片,创建动态效果。 在实际操作中,一个常见的做法是将图片资源存储在一个JSON数组中,然后通过JavaScript代码逐个加载。比如,压缩包...

    背景自动变换炫酷后台登录html模板_背景 后台 登录 login.zip

    JavaScript可以定时更换背景图片,比如使用setInterval函数来设定间隔时间,配合数组存储不同的背景图片URL,每次切换时更新背景图片的src属性。而CSS3的background-image和animation属性也可以实现类似效果,通过...

    背景自动变换炫酷后台登录html模板_背景 后台 登录 login.rar

    这可能涉及到定时器函数,用于定时更换背景图片,或者使用事件监听来响应用户交互,比如页面滚动或点击,触发背景更换。 4. **响应式设计**:由于是后台登录页面,它可能包含了响应式设计,以适应不同设备的屏幕...

    登录背景切换特

    同时,`animation`属性则可以创建自定义动画序列,比如定时更换背景图片。 3. **响应式设计**: 考虑到不同设备的屏幕尺寸,背景切换特效也需要适应各种分辨率。使用媒体查询(media queries)可以确保特效在手机、...

    saveBingWllpaper_必应_爬虫_bing_

    为了自动下载这些壁纸并设置为桌面背景,开发者可能编写了一个Python脚本或者小程序,利用网络请求库如`requests`或`urllib`来获取网页数据,然后通过解析HTML或JSON响应来提取壁纸链接。 爬虫的工作流程可能如下:...

    随机背景个人引导页源码

    在这个案例中,可能使用了JavaScript定时器(setTimeout或setInterval)来定时执行背景图片的更换,同时结合CSS3的transition属性来实现淡入淡出效果。这涉及到JavaScript事件处理、DOM操作以及CSS动画知识。 1. **...

    动态桌面Dynamic Desktop

    这种技术通常通过软件实现,能够根据时间、天气、用户活动或其他参数来改变桌面背景,使得桌面更加生动有趣。 在本案例中提到的“经典小女孩动态桌面”,可能是以一个小女孩为主题,背景或动作会随着时间和用户交互...

    简单网页模版静态网页

    }`将设置整个页面背景色,`#header{height: 100px;}`定义了头部的高度。 3. **响应式设计**:现代网页通常需要适应不同的设备和屏幕尺寸。模版可能采用了媒体查询(`@media`)来实现响应式布局,确保在手机、平板和...

    ImgurDesktop:从Imgur上的rwallapers中获取随机的桌面图片,并将其设置为您的桌面图片

    它能够自动从流行的图像分享平台Imgur的“r/wallpapers”板块抓取最新的壁纸图片,并随机选取一张设置为用户的桌面背景。这款应用充分利用了Imgur的API接口,让用户可以轻松地享受到高质量的壁纸资源。 **1. Imgur ...

    仿西安米兰摄影大背景js轮换效果

    3. **JavaScript事件处理**:为了控制图片的轮换,开发者需要设置定时器(setTimeout或setInterval)来定期触发更换图片的函数。同时,可能还需要添加用户交互功能,如点击按钮手动切换图片,这需要用到事件监听器...

    大气磅礴的网页背景滑块效果.zip

    例如,可以使用定时器来定期更换背景,或者根据用户的滚动事件来触发切换。 2. **jQuery 或其他框架**:为了简化JavaScript的开发,开发者可能会选择使用jQuery或其他轻量级的JavaScript库,它们提供了丰富的API和...

    day31-Password Generator(密码生成器)

    2. 创建交互效果:比如当鼠标悬停在按钮上时改变背景色,或者在焦点时改变输入框的边框样式。 3. 适应不同设备:通过媒体查询实现响应式设计,确保在手机、平板电脑和桌面电脑上的视觉一致性。 【JavaScript】负责...

    全屏幻灯片展示网站模板

    3. **交互性**:用户可能可以通过点击或触摸操作来切换幻灯片,同时还可以设置自动播放功能,定时更换背景。 4. **内容区域**:除了全屏背景,模板还会包含内容区域,用于放置文字、图片、按钮或其他交互元素,这些...

    python下载Bing壁纸

    Bing壁纸通常具有高质量且每日更新,因此,这个工具可能对那些希望定期自动更换桌面背景的用户非常有用。 描述中提到“有源码和exe文件”,表明该项目不仅提供了可执行的程序(.exe),还提供了源代码。对于开发者...

    明日科技C#示例源码.part01

    实例054 利用API设置桌面背景 196 实例055 音乐风景桌面 198 实例056 定时关闭计算机 201 实例057 设置任务栏时间 205 实例058 CPU使用率 206 实例059 进程管理器 209 实例060 数字大小写转换 ...

    明日科技C#示例源码

    实例054 利用API设置桌面背景 196 实例055 音乐风景桌面 198 实例056 定时关闭计算机 201 实例057 设置任务栏时间 205 实例058 CPU使用率 206 实例059 进程管理器 209 实例060 数字大小写...

    拍拍网产品推荐广告轮换

    广告轮换在此背景下,可能是焦点图中的广告内容按照预设逻辑进行定时或随机更换。 结合压缩包子文件的文件名称“拍拍网产品推荐广告轮换”,我们可以推测这可能是一个包含所有必要代码和资源的完整实现包,可能包含...

    带关闭的js对联广告代码

    7. **广告轮换**:如果广告需要定期更换,可以使用JavaScript实现广告轮换功能,定时切换不同的广告内容,增加广告的多样性和吸引力。 8. **兼容性检查**:由于JavaScript的实现可能会因浏览器差异而有所不同,开发...

Global site tag (gtag.js) - Google Analytics