主要な主流のウェブサイトのホームページは、通常、この大きなバックグラウンドマップに慣れていないことを考えると、大きな背景写真を使用します。バックグラウンドチャートに「閉じる」ボタンを配置します。「閉じる」ボタンをクリックするだけで、大きな背景チャートが消えます。
JavaScriptを使用して、バックグラウンド写真をクリックすると、CSSを制御して、背景マップがロードされない場合、Cookieが故障します。ロード。
HTML
一般的な背景画像の閉じたボタンは、ページの閉じた背景ボタンを配置します。
次のようにコードコードをコピーします。
<div id = "top">
<em id = "close_btn"> </em>
</div>
CSS
また、大きな背景画像を準備する必要があります。
次のようにコードコードをコピーします。
*{マージン:0;
Body {font:12px/18px "Microsoft yahei"、Tahoma、Arial、Verdana、 "/5b8b/4f53"、sans-serif;}
#TOP {width:1000px:0
#close_btn {60px;
ディスプレイ:block:2;}
CSSを展開した後、ページはJavaScriptを使用して背景写真をロードする必要がありません。
JavaScript
最初の読み込みページ(現時点ではCookieなどがありません)の場合、もちろん、完全なページ効果を表示するために背景画像をロードする必要があります。 [閉じる]ボタンをクリックすると、この時点でJavaScriptはページにロードされた背景写真、つまり表示されず、Cookieを設定し、Cookieの有効期限を通して大きな背景画像を制御します。つまり、ページが更新されている場合、Cookieが期限切れになっていない場合、大きな背景画像が読み込まれず、大きな背景画像がロードされます。コードをご覧ください。
次のようにコードコードをコピーします。
$(function(){
iftcookie( "mainbg")== 0){
$( "body、html")。
$( "#close_btn")。
} それ以外 {
$( "body")。
$( "html")。
$( "#close_btn")show()。
}
//クリックして閉じます
$( "#close_btn"){){
$( "body、html")。
$( "#close_btn")。
setCookie( "mainbg"、 "0");
});
})
明らかに、ページ要素のCSSバックグラウンドプロパティを設定することにより、背景図の読み込みを制御し、getCookie()とsetCookie()の2つのカスタム関数を介してCookieを読み取り、設定します。
次のようにコードコードをコピーします。
// Cookieを設定します
function setcookie(name、value){
var exp = new date();
exp.settime(exp.gettime() + 1*60*60*1000);
document.cookie = name + "=" + escase(value) + "; expires =" + exp.togmtring();
}
// Cookies関数を取ります
function getCookie(name){
var anrr = document.cookie.match(new regexp( "("(^|) "+name+" =([^;]*)(; | $) ")));
if(arr!= null)unescape(arr [2]);
}