人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

Javascriptの質問です。

マウスオーバーすると上から下に画像をスライドさせたいのです。マウスアウトしたら元に戻るという仕組みです。

ちなみに画像はブラウザの一番上から出したく、マウスオーバーさせていない状態では見えてないという仕組みで、画像を下にスライドさせた時は下にある画像と重なりますので、レイヤーを一番上にしてください。

※できる限り全ブラウザ対応のものを希望します。

ここにあるよというURLがあれば、それでも構いません。よろしくお願いいたします。

●質問者: yachinori
●カテゴリ:インターネット ウェブ制作
✍キーワード:JavaScript URL スライド ブラウザ マウス
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● zussy
●60ポイント

うさのJavaScript講座

http://www.usagi-js.com/

のサンプル集8レイヤー属性のサンプル24を応用すれば出来るかと思われます。

今は関数が初期化と実行の二つですが、

初期化、スタート、実行の3つに増やして、

onloadで初期化。

onmouseoverでスタート。

スタートから実行を呼び出す。

onmouseoutで初期化。

後は、

z-indexを調整して手前に。

スクロールのストップ地点の変更。

スクロール速度の変更。

この辺りをすればokだと思います。

◎質問者からの返答

ご返答ありがとございます。

あと、ひとつご教授いただきたいことがあります。教えていただきましたサンプルを利用して作成しているのですが、親要素のブロックをabsoluteとしてスクロールさせるにはどうすればよろしいのでしょうか。解像度を変えても位置がずれないように相対指定でいきたいと思っています。

それを横に4つ並べて、それぞれマウスオーバーさせるとY座標の位置は画像の横幅分ずれて上からスクロールしてくるという仕様です。

よろしくお願いいたします。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ