点击按钮
获取文本框的图片地址。
假设
文本框的id是
input.
按钮点击之后执行下面操作。
var
img=
document.getElementById("input").value()
document.body.style.backgroundImage="url("+img+")"
然后就会改变网页的背景
javascript脚本：
<script type="text/javascript">// 定义可换的颜色
var colors = ["#ff0000", "#00ff00", "#0000ff", "#ffff00", "#00ffff", "#ff00ff"]
var index = 0
// 换色方法
function changeColor() {
// 获取颜色代码
var color = colors[index++]
// 更改文档的背景色
document.bgColor = color
if (index == colors.length) {
index = 0
}
}
</script>
HTML代码：
<input type="button" value="换色" onclick="changeColor()" /><style>#bg img{margin:0 5pxborder:1px solid #dddwidth:80pxheight:80px}
#bg img.on{border-color:#f00}
</style>
<div id="bg">
<img src="缩略图地址" rel="大图地址">
<img src="缩略图地址" rel="大图地址">
<img src="缩略图地址" rel="大图地址">
</div>
//引入jQuery.js
<script>
var $mg=$("#bg").find("img")
$mg.click(function(){
var big=$(this).attr("rel")
$("body").css("background","url("+big+") 50% 50% no-repeat")
$(this).addClass("on").siblings("img").removeClass("on")
})
</script>
上面就是最简单的背景切换加缩略图，需要引入jQuery哈
