js控制DIV背景图片特效变换

JavaScript09

js控制DIV背景图片特效变换,第1张

给你举个简单的例子哈，你需要把var pic_arr=new Array("silkroad_1.jpg","silkroad_2.jpg","silkroad_3.jpg")这个里面存储的图片换成自己图片的路径就可以了=========================<!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-Type" content="text/htmlcharset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

#pic_div{

width:400px

height:267px

}

</style>

</head><body>

<div id="pic_div" style="background:url(silkroad_1.jpg) no-repeat"></div>

<input type="button" value="切换背景图" onclick="test()" />

<script type="text/javascript">

var count=0

var pic_arr=new Array("silkroad_1.jpg","silkroad_2.jpg","silkroad_3.jpg")

function test(){

var pic_div=document.getElementById("pic_div")

pic_div.style.background="url("+pic_arr[count+1]+") no-repeat"

count++

if(count>=3)

{

count=0

pic_div.style.background="url("+pic_arr[count]+") no-repeat"

}

}

</script>

</body>

</html>

JS特效就是网页中实现的特殊效果或者特殊的功能的一种技术,是用网页脚本(javascript)来编写制作动态特殊效果。

比如图片切换，渐变等等，它为网页活跃了网页的气氛，有时候会起到一定的亲切力。

JavaScript 是根据 "ECMAScript"标准制定的网页脚本语言。这个标准由 ECMA 组织发展和维护。ECMA-262 是正式的 JavaScript 标准。

扩展资料：

能够具有交互性，能够包含更多活跃的元素，就有必要在网页中嵌入其它的技术。如：Javascript、VBScript、Document Object Model（DOM，文档对象模型）、Layers和 Cascading Style Sheets（CSS，层叠样式表）。

JavaScript 使网页增加互动性。JavaScript 使有规律地重复的HTML文段简化，减少下载时间。JavaScript 能及时响应用户的操作，对提交表单做即时的检查，无需浪费时间交由 CGI 验证。JavaScript 的特点是无穷无尽的，只要你有创意。

js特效里图片不会滚动的原因是没有使用js里的定时器。根据查询相关资料信息，js特效里让图片无缝滚动就是要让图片集在一定时间里自动切换，需要js里的定时器来控制时间，没有使用定时器功能就无法实现图片滚动。js指JavaScript，是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。