サイト内リンクにhashを追加することにより頁遷移後のスクリプトにデータを渡せる事は 前記事のサンプルで明らかになった訳ですが、「単純にhash部分を付け足す」 という方法を通常のblogで行いますとマズい事になってしまいます。
そう、「既に #〜 が付いている（最近のコメントやＴＢリスト等の）リンク」 が正常に表示されなくなってしまうのです。
この問題への対策を追加し、また従来の関数と同様に複数の領域（データ）を扱えるようにした「実用版」を作ってみました。
【 設定法 】 HTMLのhead領域に以下のスクリプトを書きます。
<script type="text/javascript"><!--
var HS=location.hash; var HR="+";
function getH(P) {
if (HS.indexOf(P)>-1) {
return HS.split(P)[1].split("_")[0];
} return 0;
}
function addH(P,Q) { HR+=(P+Q+"_") }
function setH() {
if(HR!="+"){
var A=document.getElementsByTagName('A');
var myID="<%url>";var U; var h;
for (i=0;i<A.length;i++){ U=A[i].href; h="";
if (U.indexOf(myID)>-1) {
if (U.indexOf("#")>0) {
var p=U.split("#"); U=p[0]; h=p[1];
} A[i].href = U+"#"+h+HR;
} } } }
function hRnd(X,N,G,S){
if (document.getElementById){
var n=eval(getH(X));
if (n<1){ n=Math.floor(Math.random()*N)+1 }
if (n>=N) {n=1} else {n++}
var F="url(<%url>file/"+ X + n+"."+G+") "+S;
document.getElementById(X).style.background=F;
addH(X,n);
} }
function hRoll(){
if(HS.indexOf('+')>-1) {
var H=HS.split('+')[0].split('#')[1];
if(H!=""){ if(document.getElementById(H)) {
document.getElementById(H).scrollIntoView();
} else {
document.getElementsByName(H)[0].scrollIntoView();
} } } }
// --></script>背景画像をランダム表示させる領域にＩＤを振りデフォルトのＣＳＳを指定する事、 背景画像の命名法や 表示領域の後に書くスクリプトの記述要領等は ここまでの記事と同様です。
<script type="text/javascript">hRnd("ID名",枚数,"type","style")</script><script type="text/javascript">setH();hRoll()</script>【 解 説 】
スクリプトは最初に「参照データ」用と「送信データ」用の変数を用意します。
現在のhashを参照し 各領域での（背景画像設定）処置を行う際に「次頁」用のデータの作成も行います。
そして処理終了後にソース末尾のスクリプトがサイト内リンクのURLに新たなデータを付加すると共に 本来表示されるべきだった現在頁のラベルの「頭出し」を行います。
* このシステムを利用する際は頁内ラベルやIDに”+”と”_”は使用できなくなります
前記事を除き 此処までのscriptは概ね「複数領域」対応です（ 今回は３領域を処理しています ）
| . |