BBS
HTML
CSS
JavaScript
DHTML
フィルタ
CGI
アクセス向上
音楽&動画
カラー
画像
フォント
特殊文字
HP作成リンク
サイト宣伝リンク
ACCESS R
ホーム
>
DHTML
>
ロゴセット(左下)
■説明
ページの左下にロゴをセットすることが出来ます。ページをスクロールさせても常に左下に配置するようになっています。IE4から動作します。N4からも動作します。一応クロスブラウザー(IE/Nに対応しているという意味)となっています。DHTMLの機能です。動的なページを作ることが出来ます。
■ソース
<HTML> <HEAD> <META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript"> <TITLE>ロゴセット(左下)</TITLE> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript1.2"> <!-- //―――――――――――――――――――――――――――――――――――――― // 作成者 るび〜/ACCESS R http://www5e.biglobe.ne.jp/~access_r/ //―――――――――――――――――――――――――――――――――――――― //―――――――――――――――――――――――――――――――――――――― // ユーザが設定する部分はここから!! //―――――――――――――――――――――――――――――――――――――― var imagefile1 = "banner.jpg"; //画像ファイル名 var width1 = 88; //画像の横サイズ var height1 = 31; //画像の縦サイズ //―――――――――――――――――――――――――――――――――――――― // ユーザが設定する部分はここまで!! //―――――――――――――――――――――――――――――――――――――― function LogoSet4(){ if(document.all){ document.all("logo1").style.left = document.body.scrollLeft; document.all("logo1").style.top = document.body.scrollTop + document.body.clientHeight - height1; document.all("logo1").style.display = "block"; }else if(document.layers){ document.layers["logo1"].left = window.pageXOffset; document.layers["logo1"].top = window.pageYOffset + innerHeight - height1 - 15; document.layers["logo1"].visibility = "show"; }else if(document.getElementById){ document.getElementById("logo1").style.left = window.pageXOffset; document.getElementById("logo1").style.top = window.pageYOffset + innerHeight - height1 - 15; document.getElementById("logo1").style.display = "block"; } } if(document.all || document.getElementById){ document.write('<DIV ID="logo1" STYLE="position:absolute;left:0px;top:0px;display:none;">'); document.write('<IMG SRC="' + imagefile1 + '" WIDTH="' + width1 + '" HEIGHT="' + height1 + '">'); document.write('</DIV>'); window.onscroll = LogoSet4; window.onload = LogoSet4; }else if(document.layers){ document.write('<LAYER ID="logo1" VISIBILITY="hidden">'); document.write('<IMG SRC="' + imagefile1 + '" WIDTH="' + width1 + '" HEIGHT="' + height1 + '">'); document.write('</LAYER>'); window.setInterval(LogoSet4, 100); } //--> </SCRIPT> </BODY> </HTML>
■ソースの説明
ユーザが設定する部分はコメントに記述してある部分をよく読んで設定してください。
JavaScriptを外部ファイルも設置出来るようにしました。設定する際には<BODY>〜</BODY>内に以下の分を記述して下さい。尚、ここから
ダウンロード(dhtml_135.js)
して下さい。設定を変える際には、ダウンロードした
dhtml_135.js
ファイルを直接修正して下さい。
ロゴセットにはバナーの画像(banner.jpg)を使用しています。バナーの画像(banner.jpg)は各自で手に入れて下さい。
使用しているものは、「
document.all
」と「
document.layers
」と「
document.getElementById
」の3つ使用することによって両ブラウザに対応しています。対応していないブラウザに関しては何も表示しないようになっています。
IEは、「
document.all(id).style.left
」でページの左側に画像を配置するように設定しています。
N4は、「
document.layers[id].left
」でページの左側に画像を配置するように設定しています。
N6は、「
document.getElementById(id).style.left
」でページの左側に画像を配置するように設定しています。
IEは、「
document.all(id).style.top
」でページの下側に画像を配置するように設定しています。
N4は、「
document.layers[id].top
」でページの下側に画像を配置するように設定しています。
N6は、「
document.getElementById(id).style.top
」でページの下側に画像を配置するように設定しています。
■対応ブラウザ
ロゴセット(左下)
IE3
IE4
IE5
IE5.5
IE6
N3
N4
N6
N7
O6
×
●
●
●
●
×
●
●
●
×
[
ホーム
] [
DHTML
] [
↑ページ最上部へ戻る
]
簡単に1クリックで宣伝広告!!
個人が全ての検索エンジンやメルマガ等に登録していくのは、非常に大変な労力となっています。しかし、
簡単に検索エンジン、リンク集、掲示板、メルマガの全てに1クリック
でPRが出来てしまいます。
Copyright © 2000-2003 ACCESS R All rights reserved. Presented by Ruby