JSの写真を水平スクロール無限ループ

このリンク：https://blog.csdn.net/a772116804/article/details/80283025
1 <！DOCTYPE HTML PUBLIC " - // W3C // DTD XHTML 1.0過渡// EN "" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
 2 <HTMLのxmlns = " http://www.w3.org/1999/xhtml " >
 3 <ヘッド>
 4 <メタHTTP-当量= " Content-Typeの"コンテンツ= " text / htmlの;のcharset = UTF-8 " />
 5 <メタHTTP-当量= " X-UA-互換"コンテンツ= " IE =エッジ、クロム= 1 " >
6 <タイトル> JS </タイトル>
 7<メタ名= " ビューポート"コンテンツ= " 幅=デバイス幅、初期スケール= 1.0、最小スケール= 1.0、最大規模= 1.0、
8ユーザスケーラブル= NO " /> 
9 <スタイル>
 10 * {マージン：0 ;パディング：0 ;}
 11  ＃のDIV1 {
 12      位置：相対;ボーダー：1ピクセルの灰色の固体。
13      幅：760px;
14      マージン：20ピクセルオート;
15      高さ：160ピクセル。
16      オーバーフロー：隠されました。
17  }
 18  ＃DIV1 UL {
 19      位置：絶対。
20     左：0 ;
21  }
 22  ＃DIV1 A {
 23      位置：絶対。
24      Z-度：2 。
25      テキストベースの装飾：なし;
26      上部：45％。
27      ディスプレイ：なし。
28  }
 29  ＃DIV1 ULリー{
 30      パディング：5pxの。
31      リスト- スタイル：なし。
32      幅：180ピクセル。
33      高さ：150ピクセル。
34      フロート：左;
35  }
 36  ＃DIV1 ULのLi IMG {
 37     幅：100％;
38      高さ：100％。
39  }
 40 </スタイル>
 41 </ HEAD>
 42 <body>
 43 <スクリプトタイプ= " テキスト/ javascriptの" >
 44      window.onload = 関数（）{
 45          VAR oDiv =のdocument.getElementById（' DIV1 ' ）。
46          VAR OUL = oDiv.getElementsByTagName（' UL '）[ 0 ];
47          VAR= oUl.getElementsByTagName ALI（' リー' ）;
 48          のvarを1aA = oDiv.getElementsByTagName（' A ' ）;
 49          VAR iSpeed = 1 ; // 正、負は左右
50          VARタイマ= NULL ;
 51である         //はULの幅を算出しますワイド及び全てのLi; 
52である          oUl.innerHTML + + = oUl.innerHTML oUl.innerHTML;
 53である          oUl.style.widthアリ= [ 0 ] + aLi.length .offsetWidth * ' PX ' ;
 54は、         スライダー（関数）{
 55              IF（oUl.offsetLeft <-oUl.offsetWidth / 2 ）{
 56                  oUl.style.left = 0 。
57              } そう であれば（oUl.offsetLeft> 0 ）{
 58                  oUl.style.left = -oUl.offsetWidth / 2 + ' ピクセル' ;
59              }
 60              oUl.style.left = oUl.offsetLeft-iSpeed + ' ピクセル' ; // 正负为方向
61          }
 62          タイマ=たsetInterval（スライダ、30 ）。
63          を1aA [0 ] .onclick = 関数（）{
 64              iSpeed = 1 ; // 制御速度プラス又はマイナス
65          }
 66          を1aA [ 1 ] .onclick = 関数（）{
 67              iSpeed = - 1 ;
 68          }
 69          oDiv.onmouseover = 関数（ ）{
 70              ;てclearInterval（タイマ）
 71である         }
 72          oDiv.onmouseout = 関数（）{
 73が              タイマ=たsetInterval（スライダ、30 ）;
 74          }
 75     }。
76 </スクリプト>
 77 <DIV ID = " DIV1 " >
 78      <UL>
 79          <LI> <IMG SRC = " IMG / 2.JPG " > </ LI>
 80          <LI> <IMG SRC = " IMG / 3 .JPG " > </ LI>
 81          <LI> <IMG SRC = " IMG / 4.JPG " > </ LI>
 82          <LI> <IMG SRC = " IMG / 5.jpg " > </ LI>
 83      < / UL>
 84      <左：10pxの; " > << / A>
 85      <HREF = " javascriptの:; "スタイル= " 右：10pxの; 「 >> </a>の
 86 </ divの>
 87 </ BODY>
 88 </ HTML>
JSの写真を水平スクロール無限ループ

おすすめ
