TOP /JavaScript	ページの横スクロール

←(L) Top(T) →(R) End(E)

横方向にスクロールします。

1. 矢印ボタンで左右に移動
2. ←(Alt+L),→(Alt+R),Top(Alt+T),End(Alt+E)
3. キーボードの矢印キーで移動
   ←(右に移動)→(左に移動)↑(Topに移動)↓(Endに移動)

NNでは縦スクロールが表示されません。

<style type=text/css><!--
body{overflow:hidden;overflow-y:auto;}
--></style>

<style type=text/css><!--
body{overflow:hidden;}
--></style>
<script type="text/javascript"><!--
scroll_pages=3;        //移動ページ数
scroll_span=1200;      //移動量
//---------------------------
movement=0;lr=0;
set_timeout=0;p=scroll_pages * scroll_span;
function scroll_c(t){
if(set_timeout || (movement<=0 && t) || (movement>=p && !t) )return;
  lr=(t)?0:1;
  scroll_l();
}
function scroll_t(){
if(movement%scroll_span || set_timeout)return;
  movement=0;
  scroll(0, 0);
if(document.all)
  document.all.control.style.pixelLeft=15;
else
  document.getElementById("control").style.left=(pageXOffset+15)+"px";
}
function scroll_e(){
if(movement%scroll_span || set_timeout)return;
  movement=p;
  scroll(p, 0);
if(document.all)
  document.all.control.style.pixelLeft=p+15;
else
  document.getElementById("control").style.left=(p+15)+"px";
}
function scroll_l(){
  movement+=(lr)?50:-50;
  scroll(movement, 0);
if(document.all)
  document.all.control.style.pixelLeft=document.body.scrollLeft+15;
else
  document.getElementById("control").style.left=(pageXOffset+15)+"px";
if(movement%scroll_span){
  setTimeout("scroll_l()", 10);
  set_timeout=1;
}else{set_timeout=0;}
}
function checkkey(evk){
k=(document.all)?event.keyCode:evk.which;
switch (k) {
case 39:
    scroll_c();
    break;
case 37:
    scroll_c('l');
    break;
case 38:
    scroll_t();
    break;
case 40:
    scroll_e();
    break;
}}
document.onkeydown =checkkey;/*himajin.moo.jp*/
// --></script>

<div id="control"style="position:absolute;top:15px;left:15px;width:100%">
<center>
<button onclick="scroll_c('l')"accesskey="L"title="Alt+L">←(<u>L</u>)
</button><button onclick="scroll_t()"accesskey="T"title="Alt+T">Top(<u>T</u>)
</button><button onclick="scroll_c()"accesskey="R"title="Alt+R">→(<u>R</u>)
</button><button onclick="scroll_e()"accesskey="E"title="Alt+E"style="">End(<u>E</u>)
</button>
</center>
</div>

<div style="position:absolute;top:50px;left:0px;margin-left:15px;width:100%">
1ページ目
</div>
<div style="position:absolute;top:50px;left:1200px;margin-left:15px;width:100%">
2ページ目
</div>
<div style="position:absolute;top:50px;left:2400px;margin-left:15px;width:100%">
3ページ目
</div>
</div>
<div style="position:absolute;top:50px;left:3600px;margin-left:15px;width:100%">
4ページ目
</div>