JSはBaiduのスキンスイッチング効果を模倣します：（ Divを交換し、Webページの背景として必要な画像を選択して、保存します）
重要：クッキーの保存ステータス
HTMLコード：
<body> <div id = "header"> <div id = "header_con"> <div> <a href = "javascript :;" onclick = "Showimgbox（）">スキンは</a> </div> </div> </div> <div id = "dimgbox"> <div id = "dimgtitle_con"> <div id = "imgtitle_con"> <div id = "title1"> <a href = "javascript：;" href = "javascript :;" onclick="hideImgBox()">Close</a></div> </div> </div> <div id="imglist"> <div><img src="image/bg0.jpg" /></div> <div><img src="image/bg1.jpg" /></div> <div><img src="image/bg2.jpg" /> </div> <div> <img src = "image/bg3.jpg"/> </div> <div> <img src = "image/bg4.jpg"/> </div> </div> </div> </div> </div> </div> </div> div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div>
CSSコード：
* {マージン：0px;パディング：0px;}＃header {height：40px;幅：100％;背景：＃000000;} a {text-decoration：none;}。dbg{float：left;}＃dimgbox {width：100％;高さ：140px; /*position：absolute;*/ background：#ffffff;上：0px;左：0px;表示：なし;}＃dimgtitle {height：40px;幅：100％; Border-Bottom：Solid 1Px #CCC;}＃imgtitle_con {width：1180px;高さ：40px;マージン：0px auto; line-height：40px;}＃title1 {float：left;}＃title1 a {display：block;背景：＃04a6f9;高さ：40px;色：#ffffff; TEXT-ALIGN：center;}＃title2 {float：right;}＃imglist {height：65px;幅：1180px;マージン：0px auto;}。imgitem {float：left;マージントップ：10px;マージン左：5px;}。imgitem img {width：100px;}JSコード：
function showimgbox（）{$（ "＃dimgbox"）。slidedown（）;} function hideimgbox（）{$（ "＃dimgbox"）。slideup（）;} $（function（）{// 5。 {//存在しない場合、最初の画像を$（ "body"）、 "url（image/bg0.jpg））に設定します。 「url（ ' + $ .cookie（ "bg-pic"） + "'）; // 1./ 1。 $（this）.attr（ "src"）; // 3。複製画像：
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。
著者：Wangwangwangmax