- ベストアンサー
marqueeをJavascriptで書く方法
- Javascriptでmarqueeのような動作を実装する方法について教えてください。
- 画像が徐々に消えたり現れたりするような動作を実現するにはどうすればいいのでしょうか？
- 指定範囲内で左から右に動く画像を表示させ、一部の範囲では表示させないようにする方法を教えてください。
- tmiyoshi
- お礼率29% (39/133)
- JavaScript
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
とりあえず思いつく方法は… ・画像の一部を表示するのならclipを利用するとか http://w3g.jp/css/display_position/clip ・あるいは親要素を設けておいて、overflow:hiddenに設定しておくとか http://w3g.jp/css/display_position/overflow 簡単な方で、二番目を利用した例 * スクリプトは画像を移動しているだけで、後はブラウザ任せという方法 * bodyのmarginやpaddingなどがあるので、位置は正確にはご質問通りではありません。 （全角空白は半角に） <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>sample</title> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <style type="text/css"> #box{ position: relative; width: 500px; height: 50px; margin-left: 100px; overflow:hidden; } #box img{ position:absolute; } </style> </head> <body> <div id="box"> <img src="btn2.gif" alt=""> </div> <script type="text/javascript"> <!-- (function(){ var min = -100; // min position var max = 570; // max position var interval = 30; // 速度（インターバル） var step = 1; // 速度（ステップ） var left = 0; // leftの初期値 var img = document.getElementById("box").getElementsByTagName("img")[0]; var id = setInterval(function(){ left += step; if(left > max) left = min; img.style.left = left + "px"; }, interval); })(); //--> </script> </body> </html>
その他の回答 (1)
- 25a13a20o
- ベストアンサー率0% (0/1)
時間が無いので、コード自体は掛けませんが、 クローンでDOMを複製して、移動距離だけ調整すればいかがでしょうか。
お礼
返信遅くなって申し訳ないです。 これでうまくいくようです。JavaScriptの問題というよりは、ブラウザの表示方法の仕方の問題ということですね。 ありがとうございました。