伺か関連ツール/ゴーストポップアップ のバックアップ(No.4)

• バックアップ一覧
• 差分 を表示
• 現在との差分 を表示
• 現在との差分 - Visual を表示
• ソース を表示
• 伺か関連ツール/ゴーストポップアップ へ行く。
  • 1 (2007-02-01 (木) 05:25:44)
  • 2 (2007-02-06 (火) 00:28:21)
  • 3 (2007-12-16 (日) 15:17:24)
  • 4 (2007-12-16 (日) 16:54:51)

---

ゴーストの名前を書くと、それにカーソルを載せた際に、Marble Noteからそのゴーストの情報を取得してPopupを表示するものです。

普通の HTML 内に Javascript を入れて、タグを書くことによりポップアップができます。

Pukiwiki Plugin 版は 伺か関連ツール/Plugin_Ghost? を見てください。

• 応用例：噂と評判[改]にプレビューポップアップ表示を追加

例

こんな感じになります。

実際のサンプルページは以下の通りです。

http://ukiya.sakura.ne.jp/other/ghostpopup.html

配布物

ghostpopup110.zip 2007/12/03 version 1.1

組み込み方

• 配布物をダウンロードします。
  • あなたのサイトのHTMLがShift-JISでない場合、.jsと.cssはあなたのサイトの文字コードにあわせて変換してください。
• 配布物の .js と .css を、あなたのサイトの適当な場所に置きます。
  • 実行許可は普通のHTMLと同じ（644）でかまいません。
• ポップアップしたいHTML内に以下の記載を追加します。URLは上で置いたURLとあわせてください。

head>要素内

<script type="text/javascript" src="./overlib.js">
<!-- overLIB (c) Erik Bosrup --></script>
<script type="text/javascript" src="./ghostpopup.js" charset="utf-8"></script>
<script type="text/javascript" src="./ghostpopup_conf.js" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="./ghostpopup.css">

body>要素内

<div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;"></div>

• ポップアップしたい部分に以下のタグを書きます。ゴースト名の部分は実際のゴースト名*1、表示名はページに表示される文字列です。

<span class="ghostpopup" onClick="ghostpopup_popup('ゴースト名','name')" onMouseOut="nd()">表示名</SPAN><br />

カスタマイズ・詳しい使い方

• ゴースト名はデフォルトで部分一致です。完全一致にしたい場合、ghostpopup_popup('ゴースト名','name','exact') と書いてください。
• IEの場合、キャッシュがかかります。
• ポップアップ窓の表示をカスタマイズしたい場合は、ghostpopup_conf.jsの ol_ から始まる変数を変更してください。
• ポップアップさせる文字列、及びポップアップ窓の中の文字列のスタイルをカスタマイズしたい場合は、ghostpopup.css を変更してください。
• ポップアップ窓の中身のレイアウト（構造）自体を変更したい場合は、ghostpopup.js のソースを変更する必要があります。
• デフォルトでは、このサイトのPHP（http://ukiya.sakura.ne.jp/other/plugin_ghost.php）経由でMarble Noteにリクエストを出します。
  • あなたのサイトがPHPを使えるのであれば、伺か関連ツール/Plugin_Ghost?からplugin_ghost.phpを持ってきてあなたのサイトに置き、ghostpopup_conf.jsのghostpopup_requestURIをそのURLに変更することができます。
• 2007/12/03 Yune Kotomi さんが、新しくなったMarbleNoteに合わせて書き換えてくれました。MarbleNoteを直接コールしていますので、引数の変更でMarbleNoteの全検索機能を利用可能です。
  • 詳細は　http://marble.g.hatena.ne.jp/keyword/%e3%82%b4%e3%83%bc%e3%82%b9%e3%83%88%e6%a4%9c%e7%b4%a2API

コピーライト・配布条件等

• 配布物には以下の著作物が含まれています。
  • overlib.js は　Erik Bosrup の著作物です。
    • http://www.bosrup.com/web/overlib/
    • Copyright Erik Bosrup 1998-2004. All rights reserved.
  • ghostpopup.js 内で Jason Levitt によって書かれた jsr_class.js を流用しています。

• その他のスクリプト等は浮子屋の著作物です。
  • それらについて利用上の不明点等があればお問合せください。

• このスクリプトは Marble Note を利用します。

更新履歴

• 2007/02/01 version1.0 新規作成
• 2007/12/03 version1.1 by Yune Kotomi; "light feather" JSON APIに切り替え