さぽている工務店
[PR]テレビ番組表
今夜の番組チェック

さぽている工務店
来客数 



サンプル

リンク


このサイトはさぽているの精神世界コーディネーターの増加を目的とした解説&サンプル配布サイトである。

まぁ、つまり精神世界いじり仲間が欲しいんです
てかせっかくいじったのに見てくれる人がいないってのが寂しいんですorz

いろんな人の世界を回ってみても根本に手を出してる人って滅多にいないんですよ
てことでこのサイトで精神世界コーディネートに目覚める人がいればなぁと思ってマス

そんなの知らん!サンプルよこせ!という方はコチラから

まず初めに

以下HTMLがある程度出来ないと難しいかもしれません
何故なら途中で初心者への配慮というものを完全に放棄しやがったので
そうでなくともHTMLをある程度理解していないと模様替えは難しいです
HTML?何それオイシイの?という方はググってください。初心者向けサイトは星の数ほどあるので

精神世界コーディネートというか精神世界の模様替えはかなり自由度が高いです
その中での数少ない制限事項が以下

1、ページ全体を編集できるわけではない
周りを囲っている枠と下のシステムメニューは消せません
2、必須システムタグは全て入れる必要がある
$messBoxやらなんやら結構な数あります
3、フレーム・フォームが使えない
フォームはテキストエリアとかですら無理です
4、スクリプトが使えない
普通に文章内でjavascriptって書いただけで弾かれる始末
5、ゲームシステムのアドレスへの直接リンク
自前で交流掲示板とかへのリンクが置けません

普通はこれに触れない範囲であれこれやるわけですが、
うちの娘の世界を見ればわかるとおり結構抜け道があります

このサイトはこれらの制限事項を潜り抜ける方法を紹介するのがメインです

あ、もちろん制限されてることをすり抜ける訳なのでガスト様に迷惑のかからない範囲でやりましょうね

制限の抜け道 Lv1

2番目の制限について
これは書いてさえあればいいので回避は簡単です
<!-- -->でコメントアウトしてみたり、
<div style="display:none;"> </div>で非表示にしてみたり
来客者フィルター[[ ]]で自分以外には見えなくしたりすればよし

4番目の制限について
<script> </script>は使えませんがOnMouseなどの1行スクリプトは書けます
適当に画像(非表示)をロードさせてOnLoad内に書いとけばページが読み込まれた時に実行できます
若干タイムラグがあるのが気になりますがそこは放置で(オイ

2008/4/7の更新でシングルクォート「'」の前に「\」が挿入されるようになりました
つまりスクリプト中で「'」が使えません。というか文章中でも使い物になりません
だったら「"」を使えばいいじゃないと思いますがそうするとOnLoad="〜"というふうにスクリプトを""で囲めなくなります
""で囲まないとブラウザは1行以上、又は途中にスペースのあるスクリプトを認識してくれません
だったら1行で書けばいいじゃないと思いますがその通りです
可読性は著しく下がりますが作ってからスクリプト中の改行、スペースは全て消しましょう
文法上どうしてもスペースが必要ならeval("new\040Date()")のように
eval関数を使ってスペースは文字コード\040で書き込めばできます

制限の抜け道 Lv2

5番目の制限について
http://game.salburg.com/suppotail/room/index.phpというのがシステムのアドレスなのですが
このうちの「.php」という文字がたとえリンクでなくても文章中に入っていると受け付けてもらえません

ではどうするのか

「.php」という文字が文章中になければいいんです

といっても「.php」が全くなければシステムのページにはアクセスできません
そこでLv1で使えると言った1行スクリプトを使います
スクリプトを使って「.ph」という文字と「p」という文字をくっ付けてやればいいんです

具体的にはこんな感じ
<a OnClick=location="index.ph"+"p?mode=SYSbbs&cbbsNo=0";>交流掲示板</a>
これなら「.ph"+"p」という文字はあっても「.php」はないので受け付けてもらえます
しかし文字をクリックすればしっかりと交流掲示板に飛ぶことができるはず

3番目の制限について
フレームに関しては使う人はいなさそう?なので省略
<iframe> </iframe>は問題なく使えます

フォームに関してはさぽているで使う可能性があるとすれば更新履歴をテキストエリアに書くぐらいだと
であればこれは代用が効いて
<div style="overflow:auto;width:300px;height:100px;">
ここに更新履歴やらなんやら
</div>
で似たような事ができます。
しかもこの方が中に色文字や画像など色々置けて使い勝手がよかったり

制限の抜け道 Lv3

1番目の制限について
これはまずサンプルを
<div style="background:#ffffff;border:solid #000000 1px;width:800px;height:600px;position:absolute;top:10px;left:50%;margin-left:-400px;">
  <div style="display:none;">
    $myLv$loveMsg$myStatus$lastWork$nextWork$hobby$color$bbsView$itemView$recipeView
    $bodyView$cosView$hymmnosView$accessLog$addressView$goConfig$serif$power$magic
    $sens$love2$messBox$reload$picture$goCity
  </div>
</div>
模様替えのテキストエリアを全部消してこれだけをコピペして変更してみてください
あ、もちろんいままでのバックアップはとった上でないと前のは消えるので注意

どうなりましたか?

ちゃんとできてれば真っ白な画面の中央に横長な枠が表示されてるはずです
明らかに普通より使える幅が広がっている上に
消せなかったシステムメニューや周りの枠、背景までもが消えています

こいつらがどこへ行ったのかというのは「background:#ffffff;」の部分を消してみればわかります

はい、つまり普段表示されている部分を上から白い四角で隠してしまったわけです
これでほぼデザイン面に関しては完全に自分の思い通りにできるようになりました
あとは<div style="〜">と最後の</div>の間に好きなように書いていくだけ

これだけではなんなので以下説明

このサンプルの真ん中あたりの$myLvやら$loveMsgやらは弾かれないように必須タグを並べてるだけなので関係なし
というか<div style="display:none;"> </div>で囲って表示されないようにしてある
改めて見ると結構な数あるな…

で、重要なのが<div style="〜">の部分
1つ1つスタイルシートの説明をしていくと

background:#ffffff;
背景の設定。この場合背景色を白にする
これがないと後ろに隠した部分が見えちゃうので注意
border:solid #000000 1px;
枠線の設定
「幅1ピクセルの黒の実線で囲め」って感じの文
width:800px;
幅の設定。幅を800ピクセルにしている
height:600px;
高さの設定。高さを600ピクセルにしている
position:absolute;
配置方法の設定
これが四角の部分を本来の位置から外して元を隠すキモ
top:10px;
上からの位置の設定
本来の表示から外れた四角をどこに置くかってことを決める
この場合語弊があるけど表示領域の一番上から四角の上辺までの距離が10ピクセルになると思ってOK
left:50%;
左からの位置の設定
ピクセルで指定するとPCによって画面の解像度が違うので人によって真ん中にこなくなる
なのでここは画面の幅に対する割合で指定している
margin-left:-400px;
上の指定だけでは四角の左辺が画面の真ん中に来てしまうので
これで400ピクセルつまり四角の幅の半分だけずらしている

最後に

ここまで理解したあなたはもう立派な精神世界コーディネーター!

と、言えるかどうかはわかりませんが
あとは自分の感性にまかせて相棒の精神世界を弄り倒してやりましょう
その時は知らせてくれば管理人は喜んですっ飛んで参りますので

管理人の作ったサンプル集はコチラ