- 締切済み
javascriptでの、同ページ内スクロール移動
同ページ内に<a>タグでスムーズで自然な動きのウィンドウスクロール移動をさせたいのですが、どなたか教えて下さい。 javascriptを使うのは知ってるのですが、記述例など具体的に教えて頂ければとても助かります。
- it-plus
- お礼率44% (4/9)
- その他（インターネット・Webサービス）
- 回答数3
- ありがとう数1
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- shinya23so
- ベストアンサー率50% (80/159)
ごめんなさいNO１、２です 。 補足し忘れました。 No2のやり方で可能ですが、 何度もタグ間を行き来する場合は、 もっと複雑なコーティングになります。 それから、分かりやすくするために、 受けて側のダミータグをコーティングしましたが、 何度も行き来する場合は、ないほうがいいです。
- shinya23so
- ベストアンサー率50% (80/159)
なるほど、分かりました。 通常はボタンでコーティングするところですね。 ダミーのタグを使うと簡単ですよ。 <html><head> <title>スクロール</title> <script language="JavaScript"> <!-- //このページ（リンクされる側）のみでコーティング //forでコーティングするとスクロール中操作不能 //setTimeout()で一定時間ごと変数iを増やす var i=0; var KYORI=1350; //移動距離…(1) var SPEED=3; //進む速さ…(2) function auto_scr(){ if(i < KYORI) { i=i+2; window.scroll(0,i);//（移動軸 X軸、Y軸）…(3) } setTimeout("auto_scr()",SPEED); } //--> </script></head> <body> <div align="center"> <h2>スクロールするスクリプト</h2> <!--読み出し位置…(4)↓--> <A onClick="auto_scr()" Href="#1" >ここから飛ばす</A> <A Name="1" >ここ</A><br><!--ダミーのタグ--> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> <A>ここまで飛ばす</A> <br> エンド </body > </html>
- shinya23so
- ベストアンサー率50% (80/159)
もうちょっと詳しく書いた方が、的確な答えがくると思います。 行いたいことが明確でないので、一応の例を挙げておきます。 <A>タグから読みだしたページが自動的にスクロールします。 通常の<A>タグのリンクから、下記のページへ（コピペ後拡張子を.htmlに） ---------------------------------------------------ここから↓ <html><head> <title>スクロール</title> <script language="JavaScript"> <!-- //このページ（リンクされる側）のみでコーティング //forでコーティングするとスクロール中操作不能 //setTimeout()で一定時間ごと変数iを増やす var i=0; var KYORI=1350; //移動距離…(1) var SPEED=3; //進む速さ…(2) function auto_scr(){ if(i < KYORI) { i=i+2; window.scroll(0,i);//（移動軸 X軸、Y軸）…(3) } setTimeout("auto_scr()",SPEED); } //--> </script></head> <body onLoad="auto_scr()">//読み出し位置…(4) <div align="center"> <h2>スクロールするスクリプト</h2> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> 0<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br> エンド </body > </html>
お礼
すいません。 やりたいのは、画像やテキストをクリックしたら、同ページ内の指定した位置までスクロール移動させたいんです。 ようは、 <a href="#bottom">ここから</a> <a neme="bottom">ここまで</a> というのを自然なスクロールで移動させたいんです。 説明不足で申し訳ないです。