フリー素材
更新日：2008年5月4日
ホームページやブログの作成に利用できる素材を公開しています。
ご自由にお使いください。
【利用規約】
1、再配布を禁止します。
2、ご自身のサイト or ブログでご利用になる際に、弊サイトへのリンクを貼ってください。テキストリンクでもOKです。
３、ご利用の際にご連絡は不要です。
ルパンタイトルコール
ルパン三世のオープニングタイトル風に文字を表示するJavaScriptです。
実際の動作を見たい方は下のリンクをクリックして下さい。
サンプル１ ・・・
ページが表示されると同時にタイトルが流れます。
サンプル２ ・・・ 左クリックや右クリックをすると、タ
イトルが流れます。
【使い方】
１．JavaScriptのファイルをダウンロードしてください。
ダウンロード：lupinTitleCall.js
２．あなたのホームページの上のほうに、先ほどダウンロードしたJavaScriptをインクルードしてください。
<script
type="text/javascript" src="/js/lupinTitleCall.js" charset="utf-8"></script>
３．次に、オープニングタイトル風に表示したい文字を<span>タグなどで囲んで、さらにIDを指定してください。
下の例では、IDに"title"と指定しています。"title"以外の文字を指定してもかまいません。
既に別のタグで"title"という文字をIDとして使用している場合は、他の文字を指定してください。
<span id="title">ルパン三世颯爽登場</span>
４．最後に、ページが表示されたときに実行されるようにします。
<body>タグの中に、onLoad="runTitleCall_1('title');" と指定してください。
ここで、'title' と指定していますが、上の<span>タグで"title"以外の文字を指定した場合は、この文字も変更してください。
シングルクォーテーションとダブルクォーテーションの使い分けには意味がありますので間違わないように記述してください。
<body onLoad="runTitleCall_1('title');">
【応用】
１．文字の表示のされ方は、2パターン用意しています。runTitleCall_2('title') のほうも試してください。
<body onLoad="runTitleCall_2('title');">
２．表示させたい文字を囲むタグは、<span>タグでなくてもかまいません。
そのタグにIDさえ設定できればOKです。
<h1 id="title">ルパン三世颯爽登場<h1>
<div id="title">ルパン三世颯爽登場</div>
<font size="5" id="title">ルパン三世颯爽登場</font>
３．ページが表示された直後ではなく、文字をクリックしたときに実行させたければ、その文字を囲んでいるタグのonClick()関数を使用します。
<span id="title" onClick="runTitleCall_1('title');">ルパン三世颯爽登場</span>
４．右クリックしたときに実行させたければ、onContextmenu()関数を使用します
。
この場合、"return false;" も必要です。
<span id="title" onContextmenu="runTitleCall_1('title');return
false;">ルパン三世颯爽登場</span>
