めいぽ関連の個人サイトで自分の装備品を紹介してるサイトは数あります。ジャミロクもちょっと紹介してみよっかなーなんて思いましたが、うまいレイアウトが見つかりません。全部をベタベタ貼り付けてもスマートじゃないし、テキストで書くのも味気ない。
・・・そうだ、めいぽのインターフェースをパクろう!
アレなら皆直感的に理解できるはずだ!
めいぽ装備紹介キット誕生の瞬間です。
ゴタクはさておき、サンプルをご覧ください。
新しいウィンドウで開きます。
めいぽ装備紹介キット サンプル
なお、一部ブラウザでチカチカ表示されちゃうことがあるようですが各装備部位をクリックすると出るようにもなっていますので無問題です。
各装備パーツにマウスカーソルを合わせると装備の詳細画像が表示されます。
また、任意にコメントを付けることができます。装備品に愛着がある方や一言ある方にも使えるようになってます。
基本的な設定方法はこれから説明します。
※2007/05/06追記
いつの間にか靴の場所が変わっていたことに気が付いたので対応しました。
※2008/06/29追記
マルチペットに伴い、ペット装備の場所が変わっていたので対応しました。2匹目以降のペット装備はこのキットではサポートしないものとします。
まずはめいぽ装備紹介キットをダウンロードします。自己解凍書庫なので解凍ソフト不要です。ダウンロードしたらダブルクリックで解凍してください。
![]() めいぽ装備紹介キット.exe (解凍ソフト不要) |
解凍したらsampleというフォルダが出てきたはずです。
さらにimg/equipとフォルダを開いていくと画像ファイルがいっぱい入っています。

ここは皆さんに画像ファイルを自前でキャプチャしてもらいます。
キャプチャした画像を同じ名前で上書きしてください。
(詳細は以下の通り)
equip.jpg

装備ウィンドウのキャプチャです。
必ず幅:304px、高さ:304pxで切り抜くようにしてください。
きっちり切り抜くとこのサイズになるはず。ズレるとズレただけ完成品もズレてしまいます。
その他 ○○.jpg
例)weapon.jpg

それぞれ装備詳細画像のキャプチャです。
必ず幅:216pxで切り抜いてください。(高さは不問)
ごめんなさい。一部216pxにならない部位もあります。適当にギリギリ切り抜いていただければOKですね。
これがズレると画像がガビガビになるおそれがあります。
ファイル名は、めいぽ装備ウィンドウの名称(下図)に対応しています。
帽子だったらcap.jpg、武器ならweapon.jpg、ペットのアクセサリーはpet-acc.jpgといった感じです。
ちなみに装備品がない部位はサンプルにしたがって、No Imageって書いてある画像ファイルを流用してくださいね。
皆さんで用意していただく材料は以上です。
次に、皆さんが装備紹介キットを貼り付けたいページにHTMLソースをコピペします。
コピーする箇所は2箇所あります。
サンプルにあるsample.htmlを開き、ソースを表示してください。
まずは<HEAD>タグの中にある
<script type="text/javascript" src="js/equip.js"></script>
<link href="css/equip.css" rel="stylesheet" type="text/css">
の2行。コピペ対象ページの<HEAD>タグの中に貼ってください。
次は<BODY>タグの中を全て。
これを対象ファイルの任意の箇所に貼り付けてください。
なお、画像ファイルのパスを変えたい場合はimgファイルのsrc属性を修正するなど、適宜対応してください。
各装備パーツのコメントはこんな感じで記述されています。
<div id="clothes" class="notesStyle" style="width:216px;
height:auto;"><img src="img/equip/clothes.jpg"><br>鎧上コメントサンプル</div>
太字部分がコメントになります。↑のような感じでお好きなコメントを入れてください。
コメントが不要なら太字部分を削除すれば画像しか表示されません。
サンプル内のフォルダも一緒にコピーする必要があります。
css、img、jsそれぞれ皆さんのサイトにコピーしてください。これで動くようになったはずです。ローカル環境で動作確認してみましょう。
動かなければパスが正しいかを確認してください。
強制はしませんが、
めいぽ装備紹介キット提供:「HP狂プリと生ぬるぽ」
みたいに一筆書いてもらえると嬉しいです。
なお、設置報告等はいりませんので気軽にどうぞ。
めいぽ装備紹介キットのご利用によって発生した損害に対し、作者のジャミロクは一切責任を負わないものとします。
また、皆さんのWEBサイトごとにディレクトリ構造はまちまちです。ブログサイトはどのあたりまでのソース改変を許しているのかジャミロクには分かりません。そのため、うまく動いてくれないといった問題は各自で解決するようにしてください。メールやwisでご質問いただいても、ジャミロクがそれらの問い合わせに対し個別サポートを行うことは一切ございません。あらかじめご了承ください。