HTML DOMイベントは、(トップに戻る簡単な関数を達成するために)

JavascriptをHTML DOMイベントは、HTML文書の要素に異なる登録済みのイベントハンドラを可能にします。イベントは、通常の関数と組み合わせて使用されているイベントが発生する前に、関数が実行されません!(このようなユーザとしてボタンをクリックします)。

 

機能コードのトップへの復帰を書き込むためにイベントを使用Onscroll次のとおりです。

<!DOCTYPE HTML> 
<HTML LANG = "ZH"> 
<HEAD> 
    <メタ文字コード= "UTF-8" /> 
    <メタ名= "ビューポート"コンテンツ= "幅=装置幅、初期の規模= 1.0" / > 
    <メタHTTP-当量= "X-UA-互換"コンテンツ= "IE =縁" /> 
    <タイトル>ドキュメント</タイトル> 
    <スタイル> 
        * {マージン:0;パディング:0 ;} 
            #mybtn {位置:固定された、高さ40ピクセル、幅100ピクセル、背景:赤;国境:なし;国境 - 半径:5pxの;右:20ピクセル、下:20ピクセル、カーソル:ポインタ;表示:なし;} 
            #mybtn:ホバー{背景 -color: #888888 ;色:#FFFFFF;}    
     </スタイル> 
</ HEAD> 
<BODY>/ HEAD> 
    <ボタンのID = "myBtnです" onclickの= "topfunction()"タイトル= "トップ">トップ</ボタン>
        
        
        scrollTopスプライト> 20 ){
                document.getElementById( "myBtnです")style.display = "ブロック" 
            } { 
                のdocument.getElementById( "myBtnです")style.display = "NONE" ; 
            } 
        } 
        関数topfunction(){
             VARタイマ=たsetInterval(関数(){ 
                document.body.scrollTop - = 20 ; 
                document.documentElement.scrollTop - = 20 ;
                 もし(document.body.scrollTop == 0 && document.documentElement.scrollTop == 0 ){ 
                    てclearInterval(タイマ)。
                } 
            }、 30 
        }
     </ SCRIPT> 
</ HTML>

 

おすすめ

転載: www.cnblogs.com/qiaowanze/p/11404561.html