JS / JQアニメーション

1、ポップアップボックス

< スタイル> 
    .mask { 
        位置固定されました
        表示なし; 100%; 
        高さ100%; 
        トップ0 ; 0 ; 
        背景RGBA(0,0,0、0.6); 
    } 
    
    .mask .loginファイル   { 500pxなど
        高さ350px ; 
        バックグラウンド#FFF ; 
        マージン150ピクセルのオート; 
    } 
</ スタイル> 
< HREF = "#" >登录</ A > < divのクラス= "マスク" ID = "マスク" > < divのクラス= "ログイン" ID = "ログイン" > </ DIV > </ DIV > < スクリプト> のvar A = document.getElementsByTagName("

    
        
    


    ];
    VaRのマスク= のdocument.getElementById(" マスク" )。
    a.onclick =  関数(イベント){ 
        mask.style.display =  " ブロック" // 阻止冒泡
        イベント= イベント|| window.event;
        もし(イベント|| するevent.stopPropagation()){ 
            するevent.stopPropagation()。
        } { 
            event.cancelBubble =  
        } 
    }
    document.onclick =  関数(イベント){ 
        イベント= イベント|| window.event;
         // タッチイベントオブジェクトの取得時の上に渡されると互換性
        のvar AAA = event.target event.target:event.srcElementを、
         IF (aaa.id !==  " ログイン" ){ 
            mask.style.display =  " なし" ; 
        } 
    } 
</ スクリプト>

 バブリングイベント:

cancalBubblt()とのstopPropagation():共通では彼らは、ブラウザのデフォルトのイベントバブリング動作を防ぐために使用されていることです。非常に頻繁にcancelBubbleはW3C標準に準拠していない、だけでIEをサポートしていますので、組み合わせて使用する。違いは、のstopPropagation()はFirefoxや他のブラウザのためのW3C標準に属しますが、IEをサポートしていないということです。
構文:e.stopPropagation()、イベントの状態を代表して、代わって配信イベントパラメータe。

jQueryのバブルとデフォルトの動作を防止するための方法は次のように書くこともできます。
event.preventDefault() - > falseを返す;するevent.stopPropagationを() - > falseを返します。

 

おすすめ

転載: www.cnblogs.com/L-xjco/p/11609849.html