js中网页图片自动更换的效果

<script>
 var arr=new Array();

 arr[0]="url(images/city.jpg)";
 arr[1]="url(images/desert.jpg)";
 arr[2]="url(images/flower.jpg)";
  var i=0;
  function  changeimage()
  {
      if(i==3)
      {
        i=0;
      }
    var div=document.getElementById("apdiv1");
    div.style.backgroundImage=arr[i];
    i++;
    window.setTimeout("changeimage()",1000);
  }
  changeimage();

 </script>
 
时间: 2024-08-10 08:17:28

js中网页图片自动更换的效果的相关文章

ASP.NET中使用JavaScript实现图片自动水平滚动效果

参照网上的资料,在ASP.NET中使用JavaScript实现图片自动水平滚动效果. 1.页面前台代码: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ImageScroll.aspx.cs" Inherits="SlideDemo.ImageScroll" %> <!DOCTYPE html><html xmlns="

网页图片自动缩小代码 防止图片撑破表格

<!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><meta http-equiv="Content-Typ

使用html2canvas js 截取网页图片下载

1.前台使用html2canvas js 截取Div元素转存为图片,下载.效果: 2.前台代码 <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>    <title></title>    <meta charset="utf-8"

FineReport中如何实现自动滚屏效果

对于一些特殊的模板,可能为了展示的更加丰富.全面会在一个页面放置很多图表.表格等内容.由于内容过多,超出了浏览器窗口的大小导致内容展示不全的情况.这样我们就需要用到JS滚屏效果来解决,这里主要介绍在FineReport中的具体制作方法. 添加加载结束事件 点击菜单模板>模板web属性>分页预览设置,选择"为该模板单独设置",添加一个"加载结束"后事件,如下图所示: JS代码如下: //从页面加载结束后延迟2000MS执行事件(滚动) setTimeout

网页图片自动轮换

1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&g

自制一个UIView代替ViewController的导航栏视图跟随scrollview滑动而改变大小并且图片移动交错效果,列表的Header View中的图片产生视差滚动效果

#import <UIKit/UIKit.h> @interface ELHeaderView : UIView@property (nonatomic, weak) UIViewController *viewController;@property (nonatomic, weak) UIScrollView *scrollView; - (id)initWithFrame:(CGRect)frame backGroudImageURL:(NSString *)backImageURL h

js中模拟移动端长按效果

我们都知道 js 是有onmousedown(鼠标按下事件)和onmouseup(鼠标抬起事件),刚开始我的思路是 鼠标抬起时间减去鼠标按下时间 var oDiv = document.getElementById('div1'); var timer1; var timer2; oDiv.onmousedown = function () { timer1 = new Date(); } oDiv.onmouseup = function () { timer2 = new Date(); v

JS控制网页图片斜向滚动(图片除了上、下、左、右滚动,还有斜向滚动哦)

<html><head><title>图片斜向移动</title><meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head><body background="http://p18.qhimg.com/t010e15dc26698ab2a8.png"><script

模仿米折网商品图片自动翻页效果

function fun(){ $(".productimg").each(function() {//遍历所有图片 var othis = $(this),//当前图片对象 top = othis.offset().top - $(window).scrollTop();//计算图片top - 滚动条top if (top > $(window).height()) {//如果该图片不可见 return;//不管 } else { othis.attr('src', othis