| 公開日 | 2003.8.12 | ||
| 最終更新日 | 2004.3.15 | ||
| バージョン | ver.1.1 | ||
| 動作確認 | IE6.0,NN4.7,NN7.1,Opera7.2 | ||
| cookie | 不使用 | ||
| CSS | 使用 | ||
| 更新履歴 | 2004.3.15 | ver1.1 | スクリプトを一部簡略化(変更点:全般) |
| アイコンダイアリー ver.1.1 |
||||
◆サンプル サンプルページはこちらをクリックしてください。 |
||||
| <機能と特徴> ・カレンダー表示機能付きの日記帳です。 ・日付をクリックするとその日の日記だけが表示されます。 ・日付の下に天気などのアイコンを表示できます。 |
||||
| 公開日 | 2003.8.12 | ||
| 最終更新日 | 2004.3.15 | ||
| バージョン | ver.1.1 | ||
| 動作確認 | IE6.0,NN4.7,NN7.1,Opera7.2 | ||
| cookie | 不使用 | ||
| CSS | 使用 | ||
| 更新履歴 | 2004.3.15 | ver1.1 | スクリプトを一部簡略化(変更点:全般) |
| 初心者向け解説 | 中級者向け解説 | ダウンロード | ||||
|
1.カスタマイズフォームを使って設定をしてください。 2.ソース1を<head>〜</head>の間に書き込んでください。 3.ソース2を<body>〜</body>の間の 日記とカレンダーを表示したい位置に書き込んでください。 4.ブラウザでテストしてみてください。 正常に動作すれば設置は完了です。 日記の書き方はカスタマイズの初心者向け解説を見てください。 |
||||||
| カスタマイズフォーム | 補足説明 | 改造方法 | ||||
|
■カレンダーの各部の呼び方
![]() ■日記の書き方 日記を書く時はソース3の10行目〜41行目までの <div>〜</div>の間に書いてください。 具体的には<div>のid属性の数字を見て 書きたい日付のところに書いてください。 例えば1日の日記を書きたいなら<div id="d_i_nikki1">〜</div>の間、 2日の日記を書きたいなら<div id="d_i_nikki2">〜</div>の間に書きこむといった要領です。
<div id="d_i_nikki3" class="d_i_icon0">
7月3日(木)<br><br>
今日も暑い日だった。
</div>
■アイコンの設定の仕方日記を書いた<div>のclass属性の数字部分を変更してください。 1つ目のアイコン(d_i_icons[1]で設定したアイコン)を使用するなら1、 2つ目のアイコン(d_i_icons[2]で設定したアイコン)を使用するなら2、 っといった要領で設定します。
<div id="d_i_nikki3" class="d_i_icon1">
7月3日(木)<br><br>
今日も暑い日だった。
</div>
|
||||||
| カスタマイズフォーム | 補足説明 | 改造方法 | ||||
|
■日記を書く年月を設定する。(半角数字:整数) //設定〜//ここまでの1〜2行目を変更してください。 1行目が年(西暦で)、2行目が月になります。 基本的に1月単位でページを作ってください。 d_i_nen = 2003; d_i_tuki = 7;■カレンダーの各部の背景色を変更する。(RGB値,色名) //設定〜//ここまでの3〜5行目を変更してください。 3行目がカレンダー上部、4行目がその下、 5行目が今日の日付の背景色になります。 d_i_iro = '#c39855'; d_i_iro2 = '#e1c193'; d_i_iro3 = '#b08340';■カレンダーの年月表示の両端の文字を変更する。(タグ可) //設定〜//ここまでの6〜7行目を変更してください。 6行目が左側、7行目が右側の文字です。 前の月や次の月に移動するリンクを張るのも1つの方法ですね。 d_i_mae = '■'; d_i_tugi = '■';■カレンダーの下に表示される文字を変更する。(タグ可) //設定〜//ここまでの8行目を変更してください。
d_i_link = 'ダイアリー';
■カレンダーの表示位置を変更する。//設定〜//ここまでの9行目を変更してください。 ここでは右側に表示するか左側に表示するかを指定します。 右ならright、左ならleftを書き込んでください。
d_i_iti = 'left';
■カレンダーの表示位置を調節する。(CSS構文)//設定〜//ここまでの10〜11行目を変更してください。 カレンダーの上及び右(もしくは左)の余白を指定します。 単位はスタイルシートで使えるものにしてください。 d_i_iti_x = '20px'; d_i_iti_y = '20px';■日記の表示位置を調節する。(CSS構文) //設定〜//ここまでの12〜13行目を変更してください。 日記の上及び右(もしくは左)の余白を指定します。 単位はスタイルシートで使えるものにしてください。 d_i_diary_x = '20px'; d_i_diary_y = '20px';■祝日を設定する。(半角数字:正の整数) //設定〜//ここまでの16行目を変更してください。 祝日の日付を書き込んでください。
d_i_shu[1] = '21';
■祝日を複数にする。//設定〜//ここまでの16行目を一行増やし、 該当個所の数字を1つ増やしたのち、 祝日の日付を書き込んでください。 d_i_shu[2] = '21';■曜日表示を設定する。 //設定〜//ここまでの19行目〜25行目を変更してください。 上から順に日、月、火、水、木、金、土と並んでいます。 d_i_days[0] = 'sun'; d_i_days[1] = 'mon'; d_i_days[2] = 'tue'; d_i_days[3] = 'wed'; d_i_days[4] = 'thu'; d_i_days[5] = 'fri'; d_i_days[6] = 'sat';■カレンダー部の各文字色を変更する。(RGB値,色名) //設定〜//ここまでの28行目〜36行目を変更してください。 上から順にカレンダー上部の年月、日曜の曜日表示、土曜の曜日表示、平日の曜日表示、 日曜日の日付、土曜日の日付、平日の日付、祝日、カレンダー下部と並んでいます。 d_i_title = '#ffffff'; d_i_sun2 = '#ff0000'; d_i_sat2 = '#0000ff'; d_i_week2 = '#000000'; d_i_sun = '#ff0000'; d_i_sat = '#0000ff'; d_i_week = '#fdf7ef'; d_i_shuku = '#ff0000'; d_i_copy = '#000000';■カレンダー部の文字サイズを変更する。(CSS構文) //設定〜//ここまでの39行目〜42行目を変更してください。 上から順にカレンダー上部の年月、曜日表示、日付、カレンダー下部と並んでいます。 d_i_title_s = '100%'; d_i_day_s = '86%'; d_i_date_s = '100%'; d_i_copy_s = '86%';■アイコンとアイコンを表示しない時の余白のサイズを設定する。(半角数字:正の整数) //設定〜//ここまでの44〜45行目を変更してください。 d_i_icon_x = '21'; d_i_icon_y = '21';■カレンダー部のアイコンを変更する。 //設定〜//ここまでの47行目を変更してください。
d_i_icons[1] = 'img/hare.gif';
■カレンダー部のアイコンを複数にする。//設定〜//ここまでの47行目を一行増やし、 該当個所の数字を1つ増やした後、 画像のパスを変更してください。 d_i_icons[2] = 'img/kumori.gif'; |
||||||
| |
|
| ■ソース1(以下のソースを<head>〜</head>の間に書き込んでください) | ||
<script language="JavaScript" type="text/javascript">
<!--//Script Created by あう,http://www5c.biglobe.ne.jp/~horoau/
//ver.1.1
d_i_days = new Array();
d_i_shu = new Array();
d_i_icons = new Array();
//設定
d_i_nen = 2003; //カレンダー年(西暦)
d_i_tuki = 7; //カレンダー月
d_i_iro = '#c39855'; //カレンダーの上部の色
d_i_iro2 = '#e1c193'; //カレンダーの下部の色
d_i_iro3 = '#b08340'; //今日の日付の色
d_i_mae = '■'; //年月表示の左側
d_i_tugi = '■'; //年月表示の右側
d_i_link = 'アイコンダイアリー'; //カレンダー下部
d_i_iti = 'right'; //カレンダーの表示位置
d_i_iti_x = '10px'; //カレンダーの表示位置調節(横方向)
d_i_iti_y = '10px'; //カレンダーの表示位置調節(縦方向)
d_i_diary_x = '30px'; //日記の表示位置調節(横方向)
d_i_diary_y = '30px'; //日記の表示位置調節(縦方向)
//祝日
d_i_shu[1] = '1';
//曜日表示(上から日〜土)
d_i_days[0] = 'sun';
d_i_days[1] = 'mon';
d_i_days[2] = 'tue';
d_i_days[3] = 'wed';
d_i_days[4] = 'thu';
d_i_days[5] = 'fri';
d_i_days[6] = 'sat';
//カレンダー部色設定
d_i_title = '#ffffff'; //カレンダー上部の年月
d_i_sun2 = '#ff0000'; //日曜の曜日表示
d_i_sat2 = '#0000ff'; //土曜の曜日表示
d_i_week2 = '#000000'; //平日の曜日表示
d_i_sun = '#ff0000'; //日曜日の日付
d_i_sat = '#0000ff'; //土曜日の日付
d_i_week = '#fdf7ef'; //平日の日付
d_i_shuku = '#ff0000'; //祝日
d_i_copy = '#000000'; //カレンダー下部
//カレンダー部サイズ設定
d_i_title_s = '100%' //カレンダー上部の年月
d_i_day_s = '86%'; //曜日表示
d_i_date_s = '100%'; //日付
d_i_copy_s = '86%'; //カレンダー下部
d_i_icon_x = 21; //アイコンのサイズ(横方向)
d_i_icon_y = 21; //アイコンのサイズ(縦方向)
//アイコン
d_i_icons[1] = 'img/hare.gif';
d_i_icons[2] = 'img/kumori.gif';
d_i_icons[3] = 'img/ame.gif';
//ここまで
onload = icon_diary;
function icon_diary()
{if(location.hash)
{return;}
d_i_now = new Date();
d_i_year = d_i_now.getYear();
d_i_month = d_i_now.getMonth()+1;
d_i_date = d_i_now.getDate();
d_i_links = 0;
d_i_icon = "";
d_i_size = "";
d_i_style = "";
if(d_i_icon_x || d_i_icon_y)
{d_i_style += ' style="';}
if(d_i_icon_x)
{d_i_size += ' width="'+d_i_icon_x+'"';
d_i_style += 'width:'+d_i_icon_x+'px;';}
if(d_i_icon_y)
{d_i_size += ' height="'+d_i_icon_y+'"';
d_i_style += 'width:'+d_i_icon_y+'px;';}
if(d_i_icon_x || d_i_icon_y)
{d_i_style += '"';}
if(d_i_year < 2000)
{d_i_year += 1900;}
d_i_day = new Date(d_i_nen+"/"+d_i_tuki+"/1");
d_i_day = 0-d_i_day.getDay()+1;
for(i=31;i>=28;i--)
{d_i_misoka = new Date(d_i_nen+"/"+d_i_tuki+"/"+i);
if(d_i_misoka.getDate()==i)
{d_i_misoka=i;break;}}
d_i_cal = '<br><table border="0" cellspacing="0" cellpadding="2" align="'+d_i_iti+'"><tr>';
d_i_cal += '<td bgcolor="'+d_i_iro+'" colspan="7" align="center" class="d_i_title">'+d_i_mae+' '+d_i_nen+'年'+d_i_tuki+'月 '+d_i_tugi+'</td>\n</tr><tr>\n';
for(i=0;i<7;i++)
{if(i==0)
{d_i_cal += '<td bgcolor="'+d_i_iro+'" width="18" align="center" class="d_i_sun2">'+d_i_days[i]+'</td>\n';}
else if(i>=1 && i<=5)
{d_i_cal += '<td bgcolor="'+d_i_iro+'" width="18" align="center" class="d_i_week2">'+d_i_days[i]+'</td>\n';}
else if(i==6)
{d_i_cal += '<td bgcolor="'+d_i_iro+'" width="18" align="center" class="d_i_sat2">'+d_i_days[i]+'</td>\n';}}
d_i_cal += '\n</tr>';
while(d_i_day <=d_i_misoka)
{d_i_cal += '<tr>\n';
for(i=0;i<7;i++)
{if(d_i_day >= 1 && d_i_day <=d_i_misoka)
{d_i_cal += '<td valign="top" align="center" bgcolor="';
if(d_i_day == d_i_date && d_i_nen == d_i_year && d_i_tuki==d_i_month)
{d_i_cal += d_i_iro3;}
else
{d_i_cal += d_i_iro2;}
d_i_cal += '" width="18" height="12"';
if(document.all)
{if(document.all("d_i_nikki"+d_i_day))
{d_i_nikki = document.all("d_i_nikki"+d_i_day).innerHTML;
if(d_i_nikki)
{d_i_cal += '><a href="#'+d_i_day+'" onClick="return icon_diary_chenge('+d_i_day+')"';
d_i_type = document.all("d_i_nikki"+d_i_day).className.replace("d_i_icon","");
if(d_i_type != 0)
{d_i_icon = '<br><img src="'+d_i_icons[d_i_type]+'"'+d_i_size+' border="0">';}
else
{d_i_icon = '<br><span'+d_i_style+'></span>';}
d_i_links = 1;}}
else
{d_i_icon = '<br><span'+d_i_style+'></span>';}}
else if(document.getElementById)
{if(document.getElementById("d_i_nikki"+d_i_day))
{d_i_nikki = document.getElementById("d_i_nikki"+d_i_day).innerHTML;
if(d_i_nikki)
{d_i_cal += '><a href="#'+d_i_day+'" onClick="return icon_diary_chenge('+d_i_day+')"';
d_i_type = document.getElementById("d_i_nikki"+d_i_day).className.replace("d_i_icon","");
if(d_i_type != 0)
{d_i_icon = '<br><img src="'+d_i_icons[d_i_type]+'"'+d_i_size+' border="0">';}
else
{d_i_icon = '<br><span'+d_i_style+'></span>';}
d_i_links = 1;}}
else
{d_i_icon = '<br><span'+d_i_style+'></span>';}}
else if(document.layers)
{if(document.layers["d_i_nikki"+d_i_day])
{d_i_nikki = document.layers["d_i_nikki"+d_i_day].clip.height;
if(d_i_nikki != 0)
{d_i_cal += '><a href="#'+d_i_day+'" onClick="return icon_diary_chenge('+d_i_day+')"';
d_i_type = document.layers["d_i_nikki"+d_i_day].pageY;
document.layers["d_i_nikki"+d_i_day].top -= d_i_type;
if(d_i_type != 0)
{d_i_icon = '<br><img src="'+d_i_icons[d_i_type]+'"'+d_i_size+' border="0">';}
else
{d_i_icon = '<br><spacer type="block"'+d_i_size+' />';}
d_i_links = 1;}}
else
{d_i_icon = '<br><spacer type="block"'+d_i_size+' />';}}
if(i==0)
{d_i_cal +=' class="d_i_sun" id="d_i_shu'+d_i_day+'">';}
else if(i==6)
{d_i_cal +=' class="d_i_sat" id="d_i_shu'+d_i_day+'">';}
else
{d_i_cal +=' class="d_i_week" id="d_i_shu'+d_i_day+'">';}
d_i_cal += d_i_day+d_i_icon;
if(d_i_links == 1)
{d_i_cal += '</a>';}
d_i_cal += '</td>\n';
d_i_day++;
d_i_links = 0;
d_i_icon = "";}
else
{d_i_cal +='<td bgcolor="'+d_i_iro2+'" class="week"> </td>\n';
d_i_day++;}}
d_i_cal += '</tr>';}
d_i_cal += '<tr><td class="d_i_copy" align="center" bgcolor="'+d_i_iro2+'" colspan="7">'+d_i_link+'</td></tr>\n';
d_i_cal += '</table>\n';
with(document)
{if(document.all)
{all("d_i_calender").innerHTML = d_i_cal;}
else if(document.getElementById)
{getElementById("d_i_calender").innerHTML = d_i_cal;}
else if(document.layers)
{layers["d_i_calender"].document.open();
layers["d_i_calender"].document.write(d_i_cal);
layers["d_i_calender"].document.close();
layers["d_i_calender"].top += d_i_iti_y;
if(d_i_iti == "right")
{layers["d_i_calender"].left -= d_i_iti_x;}
else if(d_i_iti == "left")
{layers["d_i_calender"].left += d_i_iti_x;}
layers["d_i_calender"].visibility = "visible";}}}
function icon_diary_load()
{d_i_temp = 0;
with(document)
{if(document.all)
{for(i=31;i>0;i--)
{if(all("d_i_nikki"+i))
{if(all("d_i_nikki"+i).innerHTML)
{all("d_i_diary").innerHTML = all("d_i_nikki"+i).innerHTML;
d_i_temp = 1;
break;}}}}
else if(document.getElementById)
{for(i=31;i>0;i--)
{if(getElementById("d_i_nikki"+i))
{if(getElementById("d_i_nikki"+i).innerHTML)
{getElementById("d_i_diary").innerHTML = getElementById("d_i_nikki"+i).innerHTML;
d_i_temp = 1;
break;}}}}
else if(document.layers)
{for(i=31;i>0;i--)
{if(layers["d_i_nikki"+i])
{if(layers["d_i_nikki"+i].clip.height)
{layers["d_i_nikki"+i].visibility = "visible";
d_i_temp = 1;
break;}}}}
if(d_i_temp == 0)
{setTimeout('icon_diary_load()',300);}}}
function d_i_test_layer()
{if(!document.layers)
{return;}
d_i_cal = '<div class="d_i_layer" id="d_i_test_layer">\n<table border="0" cellspacing="3" cellpadding="3"><tr>\n';
d_i_cal += '<td class="d_i_sun2">'+d_i_days[0]+'</td>\n';
for(i=1;i<6;i++)
{d_i_cal += '<td class="d_i_week2">'+d_i_days[i]+'</td>\n';}
d_i_cal += '<td class="d_i_sat2">'+d_i_days[6]+'</td>\n';
d_i_cal += '</tr><tr>\n';
for(i in d_i_days)
{d_i_cal += '<td class="d_i_sun">28</td>\n';}
d_i_cal += '</tr><tr>\n';
d_i_cal += '<td colspan="7" class="d_i_copy">'+d_i_link+'</td>\n';
d_i_cal += '</tr></table>\n</div>';
with(document)
{open();
write(d_i_cal);
close();
d_i_width = layers["d_i_test_layer"].clip.width+d_i_iti_x;}}
function d_i_spacer_write()
{with(document)
{if(document.layers)
{open();
write('<table border="0" cellspacing="0" cellpadding="0" align="'+d_i_iti+'"><tr>\n');
write('<td width="'+d_i_width+'"></td>\n</tr></table>\n');
close();}}}
function d_i_spacer_write2()
{with(document)
{if(document.layers)
{d_i_temp1 = 0;
d_i_temp2 = 0;
for(i=1;i<=31;i++)
{if(layers["d_i_nikki"+i])
{if(d_i_temp1 < layers["d_i_nikki"+i].clip.height)
{d_i_temp1 = layers["d_i_nikki"+i].clip.height;}
if(d_i_temp2 < layers["d_i_nikki"+i].clip.width)
{d_i_temp2 = layers["d_i_nikki"+i].clip.width;}}}
open();
write('<table border="0" cellspacing="0" cellpadding="0"><tr>\n');
write('<td width="'+d_i_temp2+'" height="'+d_i_temp1+'"></td>\n</tr></table>\n');
close();}}}
function icon_diary_chenge(ii)
{with(document)
{if(document.all)
{all("d_i_diary").innerHTML = document.all("d_i_nikki"+ii).innerHTML;}
else if(document.getElementById)
{getElementById("d_i_diary").innerHTML=document.getElementById("d_i_nikki"+ii).innerHTML;}
else if(document.layers)
{for(i=0;i<=33;i++)
{if(layers["d_i_nikki"+i])
{layers["d_i_nikki"+i].visibility="hidden";}
if(layers["d_i_nikki"+ii])
{layers["d_i_nikki"+ii].visibility="visible";}}}
return false;}}
if(!location.hash)
{with(document)
{open();
write('<style type="text/css">\n<!-\-\n');
write('.d_i_title {color:'+d_i_title+';font-size:'+d_i_title_s+';}\n');
write('.d_i_sun2 {color:'+d_i_sun2+';font-size:'+d_i_day_s+';}\n');
write('.d_i_sat2 {color:'+d_i_sat2+';font-size:'+d_i_day_s+';}\n');
write('.d_i_week2 {color:'+d_i_week2+';font-size:'+d_i_day_s+';}\n');
write('.d_i_sun {color:'+d_i_sun+';font-size:'+d_i_date_s+';}\n');
write('.d_i_sat {color:'+d_i_sat+';font-size:'+d_i_date_s+';}\n');
write('.d_i_week {color:'+d_i_week+';font-size:'+d_i_date_s+';}\n');
write('a.d_i_sun {color:'+d_i_sun+';font-size:'+d_i_date_s+';text-decoration:underline;}\n');
write('a.d_i_sat {color:'+d_i_sat+';font-size:'+d_i_date_s+';text-decoration:underline;}\n');
write('a.d_i_week {color:'+d_i_week+';font-size:'+d_i_date_s+';text-decoration:underline;}\n');
for(i=1;d_i_shu[i];i++)
{write('#d_i_shu'+d_i_shu[i]+'{color:'+d_i_shuku+';}\n');}
write('.d_i_copy {color:'+d_i_copy+';font-size:'+d_i_copy_s+';}\n');
write('.d_i_layer {position:absolute;visibility:hidden;}\n');
if(document.all || document.getElementById)
{write('.d_i_diary div{display:none;}');
write('#d_i_diary {margin-top:'+d_i_diary_y+';margin-left:'+d_i_diary_x+';}\n')
write('#d_i_calender{margin-top:'+d_i_iti_y+';margin-'+d_i_iti+':'+d_i_iti_x+';}\n');}
else if(document.layers)
{write('.d_i_diary div{position:absolute;visibility:hidden;margin-top:'+d_i_diary_y+';margin-left:'+d_i_diary_x+';}\n');
write('#d_i_calender {position:absolute;}\n');
for(i=1;i<d_i_icons.length;i++)
{write('.d_i_icon'+i+'{top:'+i+'px;}\n');}}
write('\n-\->\n<\/style>\n')
close();}}
d_i_iti_x = d_i_iti_x.replace("px","").replace("pt","").replace("pc","").replace("cm","")
d_i_iti_x = d_i_iti_x.replace("mm","").replace("in","").replace("ex","").replace("em","")-0;
d_i_iti_y = d_i_iti_y.replace("px","").replace("pt","").replace("pc","").replace("cm","")
d_i_iti_y = d_i_iti_y.replace("mm","").replace("in","").replace("ex","").replace("em","")-0;
d_i_diary_x = d_i_diary_x.replace("px","").replace("pt","").replace("pc","").replace("cm","")
d_i_diary_x = d_i_diary_x.replace("mm","").replace("in","").replace("ex","").replace("em","")-0;
d_i_diary_y = d_i_diary_y.replace("px","").replace("pt","").replace("pc","").replace("cm","")
d_i_diary_y = d_i_diary_y.replace("mm","").replace("in","").replace("ex","").replace("em","")-0;
// -->
</script>
| ■ソース2(以下のソースを<body>〜<body>の間に書き込んでください) | ||
<div id="d_i_calender"></div>
<div id="d_i_diary"></div>
<div class="d_i_diary">
<script language="JavaScript" type="text/javascript"><!--
if(!location.hash)
{d_i_test_layer();
d_i_spacer_write();
icon_diary_load();}
// --></script>
<div id="d_i_nikki31" class="d_i_icon1"></div>
<div id="d_i_nikki30" class="d_i_icon1"></div>
<div id="d_i_nikki29" class="d_i_icon1"></div>
<div id="d_i_nikki28" class="d_i_icon1"></div>
<div id="d_i_nikki27" class="d_i_icon1"></div>
<div id="d_i_nikki26" class="d_i_icon1"></div>
<div id="d_i_nikki25" class="d_i_icon1"></div>
<div id="d_i_nikki24" class="d_i_icon1"></div>
<div id="d_i_nikki23" class="d_i_icon1"></div>
<div id="d_i_nikki22" class="d_i_icon1"></div>
<div id="d_i_nikki21" class="d_i_icon1"></div>
<div id="d_i_nikki20" class="d_i_icon1"></div>
<div id="d_i_nikki19" class="d_i_icon1"></div>
<div id="d_i_nikki18" class="d_i_icon1"></div>
<div id="d_i_nikki17" class="d_i_icon1"></div>
<div id="d_i_nikki16" class="d_i_icon1"></div>
<div id="d_i_nikki15" class="d_i_icon1"></div>
<div id="d_i_nikki14" class="d_i_icon1"></div>
<div id="d_i_nikki13" class="d_i_icon1"></div>
<div id="d_i_nikki12" class="d_i_icon1"></div>
<div id="d_i_nikki11" class="d_i_icon1"></div>
<div id="d_i_nikki10" class="d_i_icon1"></div>
<div id="d_i_nikki9" class="d_i_icon1"></div>
<div id="d_i_nikki8" class="d_i_icon1"></div>
<div id="d_i_nikki7" class="d_i_icon1"></div>
<div id="d_i_nikki6" class="d_i_icon1"></div>
<div id="d_i_nikki5" class="d_i_icon1"></div>
<div id="d_i_nikki4" class="d_i_icon1"></div>
<div id="d_i_nikki3" class="d_i_icon1"></div>
<div id="d_i_nikki2" class="d_i_icon1"></div>
<div id="d_i_nikki1" class="d_i_icon1"></div>
<script language="JavaScript" type="text/javascript"><!--
d_i_spacer_write2();
// --></script>