jsがテキスト上浮動クリックの効果を達成するためにオブジェクトを構築します

私が表現する方法がわからない、取ることは本当に難しいという名前を付けます。直接コードに

<!DOCTYPE HTML> 
<HTML LANG = "EN"> 

<HEAD> 
    <メタ文字コード= "UTF-8"> 
    <META NAME = "ビューポート"コンテンツ= "幅=装置幅、初期の規模= 1.0"> 
    <メタHTTP-当量= "X-UA-互換"コンテンツ= "IE =縁"> 
    <タイトル>ドキュメント</タイトル> 
    <スタイル> 
        .LIST { 
            位置:固定されました。
            フォント - サイズ:14px; 
            フォント - 重さ:太字; 
            色:seagreen。
        }
     </スタイル> 
</ HEAD> 

<BODY> 

    <スクリプト>
        
        myArr = [「Leileiは、」、「あなたは、豚のイメージを持っていない」「しかし、あなたは気質の豚を持っている」、「あなたは生きて消耗空気いる」、「土地の死者廃棄物」「人間の生命のお金の半分死んで廃棄物」、「あなたは次のように見て左『私は、火星への移住したい『馬鹿「」馬鹿のような適切な外観は、』』それは『BAHああ"』、あなたを残すことである]; 

        // 配列の長さの取得
        VARを LEN = myArr.length; 

        // 変数を定義
        するvar NUMを= 0 ; 

        関数(左上)のMouseEvent {
             この .top = 上位;
             この .LEFT =が左;
             この .timer = NULL ;
             // の初期化メソッド定義
            この .INIT = 関数(){
                 この .oList =ドキュメント。createElement( "DIV" );
                この .oList.classList.add(「リスト」); // という名前のdivクラスのリストを作成します 
                document.body.appendChild(この .oListを); // ページに追加のdivのクラス名リスト
                この .oList = .style.top この .top + "PX" ;
                 この .oList.style.left = この .LEFT + "PX" ;
                 この .oList.innerHTML = myArrと[NUMを%LEN]; 
            }; 

            // 方法を設定し、その結果配列の内容を移動する、すなわち、トップ値が変化する
            この .topChange = 関数(){
                 // このタイマーは、次にウィンドウに入力されているので、このバックアップを
                VARセルフ= この;
                 // 最も受け入れトップの変数初期値
                VAR initTop = self.top;
                 //は、タイマー起動
                この .timer =たsetInterval(関数(){ 
                    self.topを - ;
                     IF(== self.top(initTop - 150 ))self.die(); 
                    self.oList.style.top = self.top + "PX" ; 
                }、 10 ); 
            } 

            この .die = 関数(){
                 // タイマークリーンアップ 
                てclearInterval(この.timer);
                 // クリアDIV 
                document.body.removeChild(この.oList); 
            } 

            この.INIT();
             この.topChangeを(); 
        } 

        // ページのクリック 
        window.onclick = 関数(EV){
             VAR EV =イベント|| EV; // イベントリスナー
            新新のMouseEvent(ev.clientY、ev.clientX); // ページのトップの位置を取得し、左をクリックして 
            NUM ++ ; 
        }
     </ SCRIPT> 
</ BODY> 

</ HTML>

オープニングページをクリックした後、効果が友人になります。私はブログや個人のWebサイトの詳細楽観することは良いの気持ちを達成するために自分でこの効果を持っています

図の効果として、

配列の内容の中にいくつかの時間のために浮動後にクリーンアップ自動的に、マウスのクリックで表示されます。これは、と非常に良いプレーではありません!

おすすめ

転載: www.cnblogs.com/zhzq1111/p/11840853.html