ここでは、当サイトで使っている javascript や スタイルシートをご紹介します。
お、こいつぁ使えるじゃん? なんて思ったら、どうぞご利用下さい。改造もOKです。
もっと効率の良いやり方があれば、ぜひ教えて下さいっ
|
|
|
というわけでうちのサイトでは、直接コンテンツのページにアクセスされた場合だけトップページへのリンクが出現させるべく、これを書きました。
これは、別途jsファイルに書き、<script type="text/JavaScript" src=ファイル名></script>で呼び出しています。
〜 JavaScriptの記述内容 〜
refer=document.referrer; if(refer.indexOf('www.friend.jp/myweb/docs/faker')==-1){ document.write("<hr>本サイトのトップページは<a href=./index.htm>こちら</a>です。<hr>"); } |
赤字のURL部分が、個別に変更する個所です。最初の部分は、自分のファイルが置いてあるURL(ルートディレクトリ)名で、これ以外のURLからのアクセス時に、下の部分の赤字で記述された文字列が表示される。というわけです。
試しに、このページを直接アドレス部へコピーして、開いてみてください。
http://www.friend.jp/myweb/docs/faker/tips_web.htm
〜 JavaScriptの記述内容 〜
function BrowserType(){ ua=0; MS1="<table border=1 width=65%><th bgcolor=#99ffff>ご注意</th><tr><td>当サイトで利用しているスタイルシートは、"; MS2="<a href=\"http://www.microsoft.com/japan/ie/\" target=\"top\">Internet Explorer 5.5以降</a>"; MS3="でサポートされてるため、貴方のブラウザでは正しく表示されないかもしれません。<BR>"; MS4="をご利用頂くと、正しく表示されたコンテンツをご覧頂けます。</td></table><p>"; //ブラウザの判別 if(navigator.appVersion.charAt(0) < "4") {ua=1;} if(navigator.appName=="Netscape") {ua=1;} //メッセージ表示 if(ua==1){document.write(MS1 + MS2 + MS3 + MS2 + MS4);ac=1;} } |
最初のMS1〜4の中身が表示するメッセージです。MS1〜4まで分けてるのは、1つだとソースが見づらいからです。
ブラウザの判別は、中ほどのifでやってます。appVersion で取れる値が4以下の場合メッセージを表示します。
これは、トップページだけで表示されます。トップページから、
<script language="JavaScript"><!--
BrowserType()
//--></script>
で呼び出しています。
当サイトに、IE5.5 or IE6.0 以外でアクセスして頂くと、見ることができますよ。
〜 JavaScriptの記述内容 〜
function poster(){ MSG1 =""; MSG2 =""; MSG3 =""; r = Math.floor(Math.random()*2); //()の後の数字は、乱数の最大数 if ( r == 0){ MSG1= "広告Aバナーのソース(その1)"; MSG2= "広告Aバナーのソース(その2)"; MSG3= "広告Aバナーのソース(その3)"; }if ( r == 1){ MSG1= "広告Bバナーのソース(その1)"; MSG2= "広告Bバナーのソース(その2)"; MSG3= "広告Bバナーのソース(その3)"; }if ( r == 2){ MSG1= "広告Cバナーのソース(その1)"; MSG2= "広告Cバナーのソース(その2)"; MSG3= "広告Cバナーのソース(その3)"; } document.write(MSG1 + MSG2 + MSG3); } |
MSG×× は、1つの変数に長々とバナーのソースを入れるとソースが見難いので分けてます。
で、"r = " の部分が乱数を取り出す部分で、赤数字がファイル数となります。この場合、A/B/C の広告があるので、2を指定しています。
if の部分で、取り出した乱数と、広告のソースを決定しています。そして、最後の "document.write" で、それを書き出しています。
あとはこのfanctionを呼び出したいページに、下記のように記述して完成です。
<script language="JavaScript"><!--
poster()
//--></script>
これで、リロードされるたびにバナーが切り替わります。試しにこのページをリロードしてみて下さい。先頭のも最後のも、ランダムにバナーが切り替わってると思います。
広告が増えたら、その分赤い部分の数値を増やし、if文を追加していけばOK。
そうそう、これ、1つ問題があります。これをやってしまうと、広告主さんから各ページのソースチェック等で見つけてもらえない可能性があります。(バナーの書き込み先が htmファイルではなく、jsファイルになるので。)
ですので、これはあくまでもサブとして利用したほうがいいかもしれません。。
2003.04.22
表示するバナーの数を増やしてみました。それぞれランダムに表示されます。
詳細はバナー切り替え(その2)をご覧下さい。
〜 JavaScriptの記述内容 〜
function poster(){ MSG1 =""; MSG2 =""; MSG3 =""; br = 0; // 前回の乱数を格納する変数 FLG = 4; //回す回数(表示する広告数) for (i=0;i<FLG;i++){ //iが FLG(広告数)になるまで繰り返す r = Math.floor(Math.random()*10); //()の後の数字は、乱数の最大数 while (br == r){r = Math.floor(Math.random()*14);} //前回と同じ数値になったらもう1回乱数GET r = Math.floor(Math.random()*10); //()の後の数字は、乱数の最大数 if ( r == 0){ MSG1= "広告Aバナーのソース(その1)"; MSG2= "広告Aバナーのソース(その2)"; MSG3= "広告Aバナーのソース(その3)"; }if ( r == 1){ MSG1= "広告Bバナーのソース(その1)"; MSG2= "広告Bバナーのソース(その2)"; MSG3= "広告Bバナーのソース(その3)"; ・ ・ ・ }if ( r == 9){ MSG1= "広告Jバナーのソース(その1)"; MSG2= "広告Jバナーのソース(その2)"; MSG3= "広告Jバナーのソース(その3)"; } document.write(MSG1 + '\n' + MSG2 + '\n' + MSG3 + "\n\n"); } |
まぁ、要は for で表示したい広告数分繰り返しただけですね。
ちなみに、上の例では、10種類のバナーから4つをランダムに選択し、横に並べて表示します。このページとリンクページもランダムに4つ並んでますよね。
12行目の while では、ランダム選択した数値が前回と同じだった場合、違う数値に変更させています。ただ、1個前しかチェックしてないので、1つ飛んで同じバナーが出ることはあります。ま、そうなったらそのバナーはラッキーってことで。。。
あ、HTMLへの記述は、上の バナー切り替え表示 と同じです。
2003.04.25
現在ふみづきで動いてるスクリプトは、これとは少し変えてあります。(forで回すのをやめ、列ごとにランダム表示させてます。)
SEO | [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送 | ||