- 締切済み
MARQUEEタグで行き帰りで画像を変えるには?
上記件ですが、2種の画像が 右→左はA画像、左→右はB画像と表示し それを繰り返し表示させたいです。 アニメーションで時間を設定し 表示を変えるのも考えたのですが ブラウザのサイズによって変わっちゃいますよね。 なにか方法ありましたら宜しくお願い致します。
- みんなの回答 (2)
- 専門家の回答
みんなの回答
- arenani_sorenani
- ベストアンサー率73% (58/79)
javascrtiptでご質問の意図のように動くものを書きました。 <script type="text/javascript"> var speed=30;//数字が小さい方が速くなる var flag=1; var imgLeft=0; function Marquee(){ imageWidth=eval(img.width); screenWidth=document.body.clientWidth; marginWidth_L=eval(document.body.style.marginLeft.replace("px","")); marginWidth_R=eval(document.body.style.marginRight.replace("px","")); if(imgLeft==0)imgLeft=marginWidth_L; if(flag){ //画像AのURL img.src="http://www.goo.ne.jp/img/submit/t_06.gif"; imgLeft+=5; img.style.left=imgLeft; if(imgLeft+marginWidth_L+imageWidth>screenWidth)flag=0; setTimeout("Marquee()",speed) }else{ //画像BのURL img.src="http://www.goo.ne.jp/img/submit/t_07.gif"; imgLeft-=5; img.style.left=imgLeft; if(imgLeft<marginWidth_R)flag=1; setTimeout("Marquee()",speed) } } window.onload=Marquee; </script> <body style="margin:50px;"> <img id="img" src="http://www.goo.ne.jp/img/submit/t_06.gif" style="position:absolute;" /> </body> .
- NYOI
- ベストアンサー率58% (56/96)
MARQUEEタグでは実現不可能な気がします。 それ以前にMARQUEEタグのようなブラウザ依存タグは使わないほうが…。 アニメーションが作れるならそれでやるか、もしくはjavascriptで作るのがスマートな気がします。