魔法のｉ−らんどの掲示板用サンプル８
TOP
<![CDATA[
//////////////////////////////////////////////////////////////////////////
/**********************************************************/
/* */
/* JavaScript External file ----- Reconstruction Script */
/* */
/**********************************************************/
//タイトル部分の変更
document.title="Custom Menu BBS";
//フレームの時に使用
//document.write('<base target="_top">');
/***************************** Beginning of Stylesheet ************************************/
document.write('<style type="text/css">',
//body は記述が多いので３段
'body {scrollbar-base-color:#048;scrollbar-face-color:#048;scrollbar-track-color:#048;scrollbar-arrow-color:#90F;scrollbar-face-color:#048;scrollbar-highlight-color:#048;scrollbar-3dlight-color:#90F;scrollbar-shadow-color:#048;scrollbar-darkshadow-color:#90F;}',
'body {overflow-y:hidden;background-color:#000000;color:#DDD;border-width:3px 3px 3px 3px;border-style:solid solid solid solid;border-color:#777777;font-family:"ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",Arial,sans-serif;margin:0;}',
'body {background-image:url(img/wall-58.jpg);background-attachment:fixed;background-repeat:no-repeat;background-position:top;cursor:url("img/curs.cur"),auto;}',
//その他の指定
'hr {border:dotted #CFF;height:2px;}',//掲示板下部の広告部分の水平線（区切り線）の指定
'hr.underline {border:dotted #CCC;height:1px;}',//内側のTABLEの中にある水平線（区切り線）の指定
'input,option,select {background:#048;;color:#FFF;font-size:70%;font-family:Helvetica,Arial,sans-serif;border:dotted #EFF thin;}',
'img {border:0;}',//画像全体の border 無しの指定
'.cen {text-align:center;margin-top:2em;margin-bottom:2em;}',
'.rig {text-align:right;margin-top:2em;margin-bottom:2em;}',
'.lef {text-align:left;margin-top:2em;margin-bottom:2em;}',
//掲示板のサブタイトルの設定
'.toptitle {background-color:#047;color:#DFF;border:dotted #90F thin;letter-spacing:.3em;font-weight:bold;font-family:Helvetica,"Times New Roman",Arial,sans-serif;}',
//TABLEの外枠の設定
//画面の上からの距離top:50px; 画面の左側からの距離left:25px; TABLE枠の大きさ指定 width:70%;height:87%; この数値変更で、TABLEの場所や大きさが決まります。
'.panel {top:45;left:25px;width:70%;height:87%;position:absolute;visibility:visible;z-index:55; }',
//内側のTABLEの余白部分
'.bbsbody {margin:2em;}',
// .overview は記述が多いので２段
//overflow-y:scroll;これで、内側のスクロールバーが表示されています。Border の設定
'.overview {overflow-y:scroll;width:100%;height:87%;border-width:15px 15px 15px 15px;border-style: inset inset inset;border-color:#CBF #048 #048 #CBF;}',
// .overview ここの部分は、内側の壁紙設定
'.overview {background-image:url(img/104.jpg);background-attachment:fixed;background-repeat:no-repeat;background-position:top;text-align:left;}',
//内側のTABLEの書き込み部分の文字指定等
'td.maintd {width:300px;background-color:#90F;font-family:"Times New Roman",Helvetica,Arial,sans-serif;font-size:95%;font-weight:bold;}',
//通常のリンク指定
'a {font-size:85%;font-weight:bold;font-family:Helvetica,"Times New Roman",Arial,sans-serif;cursor:e-resize;cursor:url("img/handapst.ani"),auto;}',
'a:link {background:transparent;color:#FFF;text-decoration:none;}',
'a:visited {background:transparent;color:#f60;text-decoration:none;}',
'a:active {background:transparent;color:#9f0;text-decoration:none;}',
'a:hover {background:transparent;color:#f50;text-decoration:none;position:relative;top:0px;left:4px;}',
//ページ上部のリンク部分
'#umisip a.labas {text-align:right;padding-right:9px;width:60px;}',
'#umisip a {width:145px;height:14px;text-align:center;font-family:Helvetica,"Times New Roman","FKシンボルゴシック","ＭＳ Ｐゴシック",Arial,sans-serif;font-weight:bold;font-size:75%;}',
'#umisip a:link {background-color:#000;color:#AAA;text-decoration:none;}',
'#umisip a:visited {background-color:#000;color:#AAA;text-decoration:none;}',
'#umisip a:active {background-color:#00C;color:#DF0;text-decoration:none;}',
'#umisip a:hover {background-color:#00C;color:#FE9;text-decoration:none;position:relative;top:0px;left:0px;}',
'#umisip {font-family:arial,helvetica; font-size:90%; font-weight:bold;}',
'.CustomMenu {position:absolute;top:0;left:20;visibility:hidden;z-index:5500;background-color:#004488;color:#9f0;border:dotted #90F thin;}',
'<\/style>');
/******************************** End of Stylesheet ***************************************/
// //////////////////// ここからページ上部のリンク部分 //////////////////// //
document.write(
'<div id="umisip" class="CustomMenu">',
'<a href="http://ip.tosp.co.jp/i.asp?i=bisoy" target="_top">Design by bisoy<\/a>',
'<a href="http://ww8.tiki.ne.jp/~bladerunner/RelaxationSpace/" target="_blank">RelaxationSpace<\/a>',
'<a href="http://external-file.com/ja/javascript_sample-0.html" target="_top">Sample List<\/a>',
'<a href="http://external-file.com/" target="_top">JavaScript External File<\/a>',
'<a href="javascript://" onclick="Puwede()" class="labas" title="スライドメニュー\ 素材屋＆スクリプト関係のリンクです。\ Click here!">MENU<\/a>',
'<\/div>');
/***** ここの部分から、分からない方は、いじらない方がいいです。 *****/
Silip = 50; //ページが表示された時、メニュー部分が左端より、どの位見えているか、幅指定する
Mabilis = 10; //移動時の早さ
mahaba = 15; //移動時の距離
var Gumalaw = true; //ページでスクロール移動させない場合、true; → false; に変更する
var Dulo;
var Subalit = 0;
ie = document.all?1:0;
n = document.layers?1:0;
ns6 = document.getElementById&&!document.all?1:0;
function Gumawa(grupo,bagay){
bagay = (!bagay) ? '':'document.'+ bagay +'.';
if (n) this.css = eval(bagay +'document.'+ grupo);
else if (ns6) this.css = document.getElementById(grupo).style;
else if (ie) this.css = eval(grupo +'.style');
this.hintay = 1;
this.opo = 0;
if (n) this.width = this.css.document.width;
else if (ns6) this.width = document.getElementById(grupo).offsetWidth;
else if (ie) this.width = eval(grupo +'.offsetWidth');
this.left = Dako;
this.grupo = grupo + "Object";
eval(this.grupo + "=this");
}
function Dako(){
if (n||ns6){
kaliwanalang = parseInt(this.css.left);
}
else if (ie){
kaliwanalang = eval(this.css.pixelLeft);
}
return kaliwanalang;
}
function Puwede(){
if(!Simply.hintay){
clearTimeout(Subalit);
Tunay() ;
}
else{
clearTimeout(Subalit);
Bakit();
}
}
function Tunay(){
if(Simply.left()>-Simply.width+Silip){
Simply.opo = 1;
Simply.css.left = Simply.left()-mahaba;
Subalit = setTimeout("Tunay()",Mabilis);
}
else{
Simply.opo = 0;
Simply.hintay = 1;
}
}
function Bakit(){
if(Simply.left()<0){
Simply.opo = 1;
Simply.css.left = Simply.left()+mahaba;
Subalit = setTimeout("Bakit()",Mabilis);
}
else{
Simply.opo = 0;
Simply.hintay = 0;
}
}
function Ilagay(){
if(!Simply.opo) Simply.css.top = eval(pasok)+parseInt(Dulo);
if(n||ns6) setTimeout('Ilagay()',30);
}
/***** ここの部分まで、分からない方は、いじらない方がいいです。 *****/
// //////////////////// ここまでページ上部のリンク部分 //////////////////// //
document.write(
'<div class="panel">',
'<p class="toptitle"><strong>Custom Menu BBS<\/strong><\/p>',
'<div class="overview">',
'<div class="bbsbody" id="bbs">');
function bisoy(){
for(i=0;i<document.links.length;i++){
if(document.links[i].innerText=="[ｹｰﾀｲMode表示]"){
document.links[i].innerHTML="<div style=\"margin-top:5px;margin-right:7em;font-weight:bold\">phone</div>";
}
if(document.links[i].innerText=="My HomePage"){
document.links[i].innerHTML="HomePage";
}
if(document.links[i].innerText=="Delete"){
document.links[i].innerHTML=" <span style=\"color:#0000ff\">★ ★<\/span><br><hr class=\"underline\">";
}
if(document.links[i].innerText=="[0]戻る"){
document.links[i].innerHTML="<img src=\"img/bahay.gif\" width=\"38\" height=\"36\" alt=\"HPに戻る\">";
}
if(document.links[i].innerText=="[1]書く"){
document.links[i].innerHTML="<br><hr>カキコ";
}
if(document.links[i].innerText=="[4]私書箱IDで書く"){
document.links[i].innerHTML="IDでカキコ";
}
if(document.links[i].innerText=="[5]変換言葉にする"){
document.links[i].innerHTML="Change";
}
if(document.links[i].innerText=="[5]ﾉｰﾏﾙ言葉に戻す"){
document.links[i].innerHTML="Normal";
}
if(document.links[i].innerText=="[6]ﾛｸﾞを表示"){
document.links[i].innerHTML="ログ";
}
if(document.links[i].innerText=="[6]ﾛｸﾞを非表示"){
document.links[i].innerHTML="No Log";
}
if(document.links[i].innerText=="ipBookMark"){
document.links[i].innerHTML="ip-B";
}
if(document.links[i].innerText=="R"){
document.links[i].innerHTML="";
}
if(document.links[i].innerText=="次へ"){
document.links[i].innerHTML="NEXT";
}
}
Lucy=bbs.innerHTML;
Jyude=Lucy.replace(/■/g,"<span style=\"color:#0000ff\">■<\/span>");Lucy=Jyude;
//曜日の変更
Jyude=Lucy.replace(/\(+月+\)/g," <span style=\"color:#DFF\">Monday<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/\(+火+\)/g," <span style=\"color:#DFF\">Tuesday<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/\(+水+\)/g," <span style=\"color:#DFF\">Wednesday<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/\(+木+\)/g," <span style=\"color:#DFF\">Thursday<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/\(+金+\)/g," <span style=\"color:#DFF\">Friday<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/\(+土+\)/g," <span style=\"color:#00F\">Saturday<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/\(+日+\)/g," <span style=\"color:#F50\">Sunday<\/span> ");Lucy=Jyude;
//訪問者の接続機種の文字部分変更
Jyude=Lucy.replace(/Pc/g," <span style=\"color:#EEF;font-size:80%\"><br><hr class=\"underline\">「Computer」<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/i\*/g," <span style=\"color:#EEF;font-size:80%\"><br><hr class=\"underline\">「NTT DoCoMo」<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/j\*/g," <span style=\"color:#EEF;font-size:80%\"><br><hr class=\"underline\">「Vodafone」<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/J\*/g," <span style=\"color:#EEF;font-size:80%\"><br><hr class=\"underline\">「Vodafone」<\/span> ");Lucy=Jyude;
Jyude=Lucy.replace(/ez/g," <span style=\"color:#EEF;font-size:80%\"><br><hr class=\"underline\">「EZweb」<\/span> ");Lucy=Jyude;
//表示回数部分の変更
Jyude=Lucy.replace(/Find/g,"<span style=\"color:#FFFFCE;font-size:80%\">表\示<\/span>");Lucy=Jyude;
Jyude=Lucy.replace(/Write/g,"<span style=\"color:#FFC;font-size:80%\">カキコ数<\/span>");Lucy=Jyude;
Bayani=Lucy.match(/<HR SIZE=1>/g);
Anna=2;
for(i=0;i<Bayani.length-2;i++){
yan=i%4;
if(i==0){
Jyude=Lucy.replace(/<HR SIZE=1>/,'<div class="cen">'
+'<table cellpadding="0" cellspacing="0" border="0"><tbody><tr>'
+'<td><img src="img/90F_ur.gif" width="20" height="20"><\/td>'
+'<td style="background:#90F" width="300" height="20"><img src="img/90F.gif"><\/td>'
+'<td><img src="img/90F_ul.gif" width="20" height="20"><\/td>'
+'<\/tr><tr>'
+'<td style="background:#90F" width="20"><img src="img/90F.gif"><\/td>'
+'<td class="maintd">');
Lucy=Jyude;
}
if(yan==1 && i!=(Bayani.length-3)){
Jyude=Lucy.replace(/<HR SIZE=1>/,'<\/td>'
+'<td style="background:#90F" width="20"><img src="img/90F.gif"><\/td>'
+'<\/tr><tr>'
+'<td><img src="img/90F_dr.gif" width="20" height="20"><\/td>'
+'<td style="background:#90F" width="300" height="20"><img src="img/90F.gif"><\/td>'
+'<td><img src="img/90F_dl.gif" width="20" height="20"><\/td>'
+'<\/tr><\/tbody><\/table>'
+'<\/div>'
+'<br><br>'
+'<div class="rig">'
+'<table cellpadding="0" cellspacing="0" border="0"><tbody><tr>'
+'<td><img src="img/90F_ur.gif" width="20" height="20"><\/td>'
+'<td style="background:#90F" width="300" height="20"><img src="img/90F.gif"><\/td>'
+'<td><img src="img/90F_ul.gif" width="20" height="20"><\/td>'
+'<\/tr><tr>'
+'<td style="background:#90F" width="20"><img src="img/90F.gif"><\/td>'
+'<td class="maintd">');
Lucy=Jyude;
}
if(i==Anna && i!=(Bayani.length-3)){
Jyude=Lucy.replace(/<HR SIZE=1>/,'<\/td>'
+'<td style="background:#90F" width="20"><img src="img/90F.gif"><\/td>'
+'<\/tr><tr>'
+'<td><img src="img/90F_dr.gif" width="20" height="20"><\/td>'
+'<td style="background:#90F" width="300" height="20"><img src="img/90F.gif"><\/td>'
+'<td><img src="img/90F_dl.gif" width="20" height="20"><\/td>'
+'<\/tr><\/tbody><\/table>'
+'<\/div>'
+'<br><br>'
+'<div class="cen">'
+'<table cellpadding="0" cellspacing="0" border="0"><tbody><tr>'
+'<td><img src="img/90F_ur.gif" width="20" height="20"><\/td>'
+'<td style="background:#90F" width="300" height="20"><img src="img/90F.gif"><\/td>'
+'<td><img src="img/90F_ul.gif" width="20" height="20"><\/td>'
+'<\/tr><tr>'
+'<td style="background:#90F" width="20"><img src="img/90F.gif"><\/td>'
+'<td class="maintd">');
Lucy=Jyude;
Anna+=2;
}
if(yan==3 && i!=(Bayani.length-3)){
Jyude=Lucy.replace(/<HR SIZE=1>/,'<\/td>'
+'<td style="background:#90F" width="20"><img src="img/90F.gif"><\/td>'
+'<\/tr><tr>'
+'<td><img src="img/90F_dr.gif" width="20" height="20"><\/td>'
+'<td style="background:#90F" width="300" height="20"><img src="img/90F.gif"><\/td>'
+'<td><img src="img/90F_dl.gif" width="20" height="20"><\/td>'
+'<\/tr><\/tbody><\/table>'
+'<\/div>'
+'<br><br>'
+'<div class="lef">'
+'<table cellpadding="0" cellspacing="0" border="0"><tbody><tr>'
+'<td><img src="img/90F_ur.gif" width="20" height="20"><\/td>'
+'<td style="background:#90F" width="300" height="20"><img src="img/90F.gif"><\/td>'
+'<td><img src="img/90F_ul.gif" width="20" height="20"><\/td>'
+'<\/tr><tr>'
+'<td style="background:#90F" width="20"><img src="img/90F.gif"><\/td>'
+'<td class="maintd">');
Lucy=Jyude;
}
}
bbs.innerHTML=Lucy+'<\/td>'
+'<td style="background:#90F" width="20"><img src="img/90F.gif"><\/td>'
+'<\/tr><tr>'
+'<td><img src="img/90F_dr.gif" width="20" height="20"><\/td>'
+'<td style="background:#90F" width="300" height="20"><img src="img/90F.gif"><\/td>'
+'<td><img src="img/90F_dl.gif" width="20" height="20"><\/td>'
+'<\/tr><\/tbody><\/table>'
+'<\/div>'
+'<\/div>';
/***ここの部分から、分からない方は、いじらない方がいいです。***/
Simply = new Gumawa('umisip');
if (n||ns6) pasok = "window.pageYOffset";
else if (ie) pasok = "document.body.scrollTop";
Simply.css.left = -Simply.width+Silip;
if (n||ns6) Dulo = Simply.css.top;
else if (ie) Dulo = Simply.css.pixelTop;
Simply.css.visibility = "visible";
if(Gumalaw) ie?window.onscroll = Ilagay:Ilagay();
/***ここの部分まで、分からない方は、いじらない方がいいです。***/
}// ←左端の記号削除不可。
window.onload = bisoy;
//通常のMIDI使用する時
//document.write('<bgsound src="hogehoge_music.mid" loop="infinite">');
//注意：画像やMIDIを魔法のｉ−らんどの掲示板に呼び出す時は、フルパスで記述します。
]]>
素材（画像等）は、ご利用される素材屋さんより、許可を頂いて下さい。
当サイトから画像等の、素材の持ち帰りは禁止です。
| Contact us at Feedback |
Last Update: 6 / 25 / 2008 17:53:02 JST