|
|
今
し
ば
ら
く
お
待
ち
を
♪
03/16(Sun) 03:05
飛び跳ねるタイトル
【お知らせ】Netscape 6,7、Opera6でも動作するよう機能追加しました(2003/04/27)
ページをオープンすると、文字タイトルが波打ちながら飛び跳ねるようにジャンプします。サンプルでは10個の文字を使ってますが、何文字でも使えます。文字のかわりに画像も使えます。
■設置方法
使用するCross-Browser function | getLEFT、getTOP、setTOPLEFT |
スタイルシート | charpos |
■ヘッダー部に以下の関数を定義します。
- .charpos { }の中のleft:200px;top:50px----文字のスタート位置です。
- font-size:25px"----文字の大きさです。
- width:30----レイヤー幅です。文字が欠ける場合は値を大きくします。
- baseY----バウンドする地面の高さです。
- limitLeft、limitRight----バウンドする左側と右側の座標です。あなたの好みに合うように調整して下さい。
- moveNum----文字の個数。文字を増やしたり減らした時はこの値を変更します。この値はスクリプト中の layerName = "ABCDEFGHIJ".charAt(i); (レイヤーA〜Jの10個)と同じにします。
- サンプルの初期値のままで使えます。上記以外の初期値はあまりいじらないほうが・・・
■ボディ部に以下の記述をします。
■<BODY>タグの中にonLoad="getPos();jumpTitle()"を記述します
■<BODY>部中に下のレイヤーを記述します。
変更する箇所は以下のとおりです。あなたのページに合わせて変更して下さい。
- ID="A"〜"J"----レイヤーの名前です。この名前はスクリプト中の layerName = "ABCDEFGHIJ".charAt(i); (レイヤーA〜Jの10個)と同じにします。
- 今しばらくお待ちを♪----飛び跳ねる文字を指定します。サンプルでは10個の文字を使ってますが、レイヤー数を変更すれば何文字でも使えます。画像にしたい時は<IMG>タグを使います。
- 最後の<HR>タグは地面です。top:220pxで地面の位置を調整できます。
|
|