如何将网页的背景图片3秒后变成另外一张图片 在网页里的图片 如何做到将鼠标放上去后就会变成另一张图片
\u5728jsp\u9875\u9762\u5982\u4f55\u7528 js \u5b9e\u73b0\u70b9\u51fb\u4e00\u4e2a\u56fe\u7247\u5207\u6362\u53e6\u4e00\u4e2a\u56fe\u7247,3\u79d2\u540e\u53c8\u6062\u590d\u4e4b\u524d\u7684\u56fe\u7247???
test
function changeImg(img) {
var a = document.getElementById(img);
a.src="2.jpg";
setTimeout("document.getElementById('img').src='1.jpg';",3000);
}
\u597d\u50cf\u5b9e\u73b0\u7684\u4e0d\u662f\u5f88\u597d\uff0c\uff0c\u53c2\u6570\u4f20\u9012 \u6709\u95ee\u9898\u3002\u3002\u4e0d\u8fc7\u697c\u4e3b\u8981\u6c42\u7684\u529f\u80fd\u662f\u6709\u4e86\u3002\u3002\u81ea\u5df1\u6539\u8fdb\u4e0b\u3002\u3002
\u4fee\u6539\u4e00\u4e0b\uff1a
test
function changeImg(img) {
document.getElementById(img).src="2.jpg";
setTimeout("document.getElementById('"+img+"').src='1.jpg';",3000);
}
\u9700\u8981\u7528Dreamweaver\u6765\u64cd\u4f5c\u5c06\u9f20\u6807\u653e\u4e0a\u53bb\u4e00\u5f20\u56fe\u7247\u53d8\u6210\u53e6\u4e00\u5f20\u56fe\u7247\u3002
\u5177\u4f53\u7684\u64cd\u4f5c\u65b9\u6cd5\u548c\u6b65\u9aa4\u5982\u4e0b\uff1a
1\u3001\u7b2c\u4e00\u6b65\uff0c\u9700\u8981\u6253\u5f00Dreamweave\u8f6f\u4ef6\u8fdb\u5165\uff0c\u4f9d\u6b21\u5355\u51fb\u4e0a\u65b9\u7684\u201c\u63d2\u5165\u201d-->\u201c\u56fe\u50cf\u5bf9\u8c61\u201d-->\u201c\u9f20\u6807\u7ecf\u8fc7\u56fe\u50cf\u201d\uff0c\u5982\u4e0b\u56fe\u6240\u793a\u3002
2\u3001\u5176\u6b21\uff0c\u5b8c\u6210\u4e0a\u8ff0\u6b65\u9aa4\u540e\uff0c\u5f39\u51fa\u5bf9\u8bdd\u6846\uff0c\u9700\u8981\u63d2\u5165\u4e24\u8f86\u8f66\uff0c\u767d\u8272\u8f66\u662f\u539f\u59cb\u56fe\u50cf\uff0c\u6a59\u8272\u8f66\u662f\u7ecf\u8fc7\u7684\u56fe\u50cf\uff0c\u5982\u4e0b\u56fe\u6240\u793a\u3002
3\u3001\u63a5\u7740\uff0c\u5b8c\u6210\u4e0a\u8ff0\u6b65\u9aa4\u540e\uff0c\u53ef\u4ee5\u8fdb\u884c\u8bbe\u7f6e\u4e86\u3002\u53ef\u4ee5\u5148\u5728\u7f51\u9875\u4e0a\u9884\u89c8\uff0c \u5728\u9875\u9762\u4e0a\uff0c\u6709\u4e00\u4e2a\u7c7b\u4f3c\u5730\u7403\u7684\u5c0f\u6d4f\u89c8\u5668\u5fbd\u6807\uff0c\u5982\u4e0b\u56fe\u6240\u793a\u3002
4\u3001\u6700\u540e\uff0c\u5b8c\u6210\u4e0a\u8ff0\u6b65\u9aa4\u540e\uff0c\u53ef\u4ee5\u770b\u5230\u5355\u51fb\u540e\u5c06\u53d8\u6210\u53e6\u4e00\u5f20\u56fe\u7247\uff0c\u56e0\u6b64\u53ef\u4ee5\u4fdd\u5b58\u8bbe\u7f6e\u5e76\u5b8c\u6210\u64cd\u4f5c\u4e86\uff0c\u5982\u4e0b\u56fe\u6240\u793a\u3002\u8fd9\u6837\uff0c\u95ee\u9898\u5c31\u89e3\u51b3\u4e86\u3002
var of=true;
function changeimg(){
of=!of;
if(of)
document.body.background='img1.jpg';
else
document.body.background='img2.jpg';
setTimeout(changeimg,3000);//如果你想只换一次就把这行去掉，不去掉就循环更换
//如果你想改变某个div的背景用下面的取ID
//document.getElementById("divid").background='img1.jpg';
}
</script>
</head>
<body onLoad="setTimeout(changeimg,3000)" id="body">
//更换背景图片的话不要在标签内写背景色，否则显示不了背景
将网页背景图片设置为3秒自动更换：
function changeBG()
{
var body = document.getElementsByTagName("body")[0];
body.style.backgroundImage = "url(yourimage.xxx)";
setTimeout("changeBG",3000); //
}
绛旓細setTimeout(changeimg,3000);//濡傛灉浣犳兂鍙崲涓娆″氨鎶婅繖琛屽幓鎺夛紝涓嶅幓鎺夊氨寰幆鏇存崲 //濡傛灉浣犳兂鏀瑰彉鏌愪釜div鐨勮儗鏅鐢ㄤ笅闈㈢殑鍙朓D //document.getElementById("divid").background='img1.jpg';} //鏇存崲鑳屾櫙鍥剧墖鐨勮瘽涓嶈鍦ㄦ爣绛惧唴鍐欒儗鏅壊锛屽惁鍒欐樉绀轰笉浜嗚儗鏅 ...
绛旓細var oImg = document.getElmentById('杞挱閲岀殑鍥剧墖').getElementsByTagName('img');for( var i in oImg){ oImg[i].onclick = function(){ documen.write('');document.body.position = 'relative';document.getElementById('鍚嶅瓧').style.position = 'absolute';document.getElementById('鍚...
绛旓細淇敼.bg1 { background:#eee;} .bg2 { background:#ccc;} 鑳屾櫙鏀规垚浣鐨勫浘鐗灏辫浜
绛旓細1銆侀鍏堟墦寮chrome娴忚鍣紝鐐瑰嚮鍙充笂瑙掔殑璁剧疆鍥炬爣锛岀偣鍑昏繘鍏ヨ缃細2銆佽繘鍏ュ悗涓嬫粦鎵惧埌涓婚鑳屾櫙閫夐」锛岀偣鍑昏繘鍏ヤ富棰樿儗鏅細3銆佷箣鍚庝細寮瑰嚭绐楀彛锛岃繘鍏hrome鍟嗗簵锛岄夋嫨chrome榛樿鍙戝竷鐨勮儗鏅壊涓婚锛4銆佽繖閲岄夋嫨slate杩欐鑳屾櫙涓婚锛岀偣鍑讳富棰樿繘鍏ヨ缃晫闈細5銆佺偣鍑绘坊鍔犺嚦chrome鎸夐挳锛屾坊鍔犱富棰樺埌chrome娴忚鍣細6銆佺瓑寰呯墖鍒...
绛旓細1銆佸湪PS杞欢涓疆鍏ユ兂瑕佹敼鍙樿儗鏅収鐗,骞舵寜Ctrl+J澶嶅埗涓灞,濡傚浘鎵绀烘槸鐧借壊鑳屾櫙銆2銆佺敤榄旀湳妫/閽㈢瑪/閫氶亾灏嗙収鐗囦笂鐨勪富浣撶墿鎶犲嚭,鎶犲浘瀹屾瘯,鎸塂elete鍒犻櫎閫夊尯鍐呭;3銆佲滄枃浠--瀛樺偍涓衡濇牸寮鍥剧墖,瀹屾垚銆2.photoshop鎬庝箞鎶婅儗鏅彉鎴閫忔槑鐨 鍦≒hotoshop涓璁剧疆閫忔槑鑳屾櫙鍙互閫氳繃鑳屾櫙杞浘灞,鐒跺悗淇濆瓨涓烘牸寮忔潵瀹炵幇,鍏蜂綋...
绛旓細濡備綍璁剧疆缃戦〉鐨勮儗鏅浘鐗锛1銆傞鍏堬紝鎵撳紑Atom缂栬緫鍣ㄥ鍏ラ」鐩枃浠跺す锛岄鍏堝垱寤轰竴涓猧ndex.html鏂囦欢銆傚畾涔塰tml鏂囦欢鐨勪富瑕佷俊鎭紝濡備笅鍥炬墍绀:2.鐒跺悗濉啓鑷繁鐨勭綉椤靛唴瀹癸紝璁剧疆鏍峰紡锛屾坊鍔犺儗鏅=/head>鏍囩涓嬮潰杈撳叆bodybgcolor=杩欐椂鎴戜滑浼氬彂鐜版湁寰堝棰滆壊渚涙垜浠夋嫨锛岃繖閲屾垜浠夋嫨绾㈣壊銆傛渶鍚庝笉瑕佸繕浜嗘爣绛剧殑闂悎锛屽嵆鍐欐垚...
绛旓細1銆佸湪PS杞欢涓疆鍏ユ兂瑕佹敼鍙樿儗鏅収鐗,骞舵寜Ctrl+J澶嶅埗涓灞,濡傚浘鎵绀烘槸鐧借壊鑳屾櫙銆2銆佺敤榄旀湳妫/閽㈢瑪/閫氶亾灏嗙収鐗囦笂鐨勪富浣撶墿鎶犲嚭,鎶犲浘瀹屾瘯,鎸塂elete鍒犻櫎閫夊尯鍐呭;3銆佲滄枃浠--瀛樺偍涓衡濇牸寮鍥剧墖,瀹屾垚銆2.photoshop鎬庝箞鎶婅儗鏅彉鎴閫忔槑鐨 鍦≒hotoshop涓璁剧疆閫忔槑鑳屾櫙鍙互閫氳繃鑳屾櫙杞浘灞,鐒跺悗淇濆瓨涓烘牸寮忔潵瀹炵幇,鍏蜂綋...
绛旓細ps涓皢鍥惧儚鍜岃儗鏅殑棰滆壊瀵硅皟鐨勬柟娉曟槸锛1銆佹墦寮鍥剧墖锛屽鍒跺浘灞傦紝鍏抽棴鑳屾櫙鍥惧眰;2銆佺偣鍑烩滃墠鏅壊鈥濇寜閽紝鎵撳紑鈥滄嬀鑹插櫒鈥濓紝鐢ㄢ滃惛绠″伐鍏封濆惛鍙鍥剧墖鑳屾櫙鑹插拰logo棰滆壊锛屽垎鍒缃负鈥滃墠鏅壊鈥濆拰鈥滆儗鏅壊鈥;3銆佺敤鈥滈瓟鏈宸ュ叿鈥濋夊畾logo鍖哄煙锛岀敤鈥滆儗鏅壊鈥濆～鍏;4銆佲滈夋嫨--鍙嶉夆濓紝鐢ㄢ滃墠鏅壊鈥濆～鍏咃紝瀹屾垚銆
绛旓細1銆傞鍏堬紝鎵撳紑Atom缂栬緫鍣ㄥ鍏ラ」鐩枃浠跺す锛岄鍏堝垱寤轰竴涓猧ndex.html鏂囦欢銆傚畾涔塰tml鏂囦欢鐨勪富瑕佷俊鎭紝濡備笅鍥炬墍绀:2.鐒跺悗濉啓鑷繁鐨缃戦〉鍐呭锛岃缃牱寮忥紝娣诲姞鑳屾櫙="灏卞湪灏镐綋鍚庨潰銆鍥剧墖"鍙互鎻掑叆鍥剧墖锛屽涓嬪浘鎵绀:3.鏈鍚庢潵鍒版祻瑙堝櫒锛屽埛鏂扮綉椤碉紝杩欐牱灏变細鏄剧ず鑳屾櫙锛屽涓嬪浘鎵绀:瀵硅璁＄殑鍏虫敞:1.閰嶈壊銆備竴涓綉椤...
绛旓細鏂规硶涓锛氫娇鐢ㄢ滈瓟鏈鈥濆伐鍏 1. 鎵撳紑鎮ㄧ殑鍥剧墖锛屽苟閫氳繃鈥滈瓟鏈鈥濆伐鍏烽夋嫨鑳屾櫙棰滆壊銆2. 鍗曞嚮鍒掗夎儗鏅鑹蹭腑涓嶉渶瑕佺殑鍖哄煙銆3. 濡傛灉瑕佹洿澶氶夋嫨锛岃鎸変綇鈥淪hift鈥濋敭骞跺崟鍑诲叾浠栧尯鍩熴4. 閫夋嫨鈥滄煋鑹测濋夐」锛鐒跺悗閫夋嫨鎮ㄦ兂瑕鐨勮儗鏅棰滆壊銆5. 鍗曞嚮鈥滅‘瀹氣濅互灏嗘墍閫夊尯鍩熸敼涓烘柊棰滆壊銆6. 灏嗘鎿嶄綔閲嶅鍦ㄦ墍鏈...
