画像はonLoad機能に表示されません

私は入力した人物がいるWebサイトで作業していますが、画像の読み込みが必要です。この画像はどの画像にも似ていますが、明らかに表示されません。私はonLoad関数とonClick関数を持っているので、一度画像が表示されていると、ユーザーは画像をクリックするだけで、理論上は消えるはずです。私は変数を持っています。最初は "false"で、ページがロードされると "true"に変更され、イメージがクリックされると再びfalseになるはずです。このようにして、画像が表示されているかどうかを制御するのはかなり簡単です。画像はonLoad機能に表示されません

私はすべてが正しいと思われるので、何が間違っているか完全にはわかりません。

ここに私のコードです。

var popUP = false; 
 

 
function popUpOpen() { 
 
    var popUp = true; 
 
} 
 

 
function popUpClose() { 
 
    var popUp = false; 
 
} 
 

 
if (popUp = true) { 
 
    document.getElementById('popUpStart').style.visibility = 'visible'; 
 
} else { 
 
    document.getElementById('popUpStart').style.visibility = 'hidden'; 
 
}

#popUpStart { 
 
    position: absolute; 
 
    left: 50%; 
 
    top: 50%; 
 
    margin-left: -325px; 
 
    margin-top: -220px; 
 
    z-index: 3; 
 
}

<body onload="popUpOpen()"> 
 

 
    <img id="popUpStart" src="popUpOnLoad.png" style="visibility:hidden" onclick="popUpClose()" /> 
 

 
</body>

出典

2016-08-01 DevLiv

'' popUp = true; '' popUp = true; '' style.visibility'関数はonloadの後に呼び出す必要があります。 –

@FastSnail、私は素早い答えを感謝します。直後の関数ステートメントで？ – DevLiv

外部スコープにあった変数を再宣言しています。 ifでvarを削除します。再割当てではなく、再割当を行います。 ==は比較のために使われます。 – Li357

あなたの本当の問題は、オンロードでも起こる前にポップアップが真であるかないかどうかを確認するコードは、正確に一度だけ実行されていることです。 popUpの値を変更することはできますが、画像の可視性は変わりません。

はあなたのような何かをしたい：

var popUp = false; 

function updateImage() 
{ 
    if (popUp === true) { 
     document.getElementById('popUpStart').style.visibility='visible'; 
    } else { 
     document.getElementById('popUpStart').style.visibility='hidden'; 
    } 
} 

function popUpOpen(){ 
    popUp = true; 
    updateImage(); 
} 

function popUpClose() { 
    popUp = false; 
    updateImage() 
}

注意をその「===」の代わりにあなたの比較では、「=」の機能に「VAR」を削除し、使用しての変更。

出典

2016-08-01 02:11:31

ありがとうございます！それは今の魅力のように働いています。 – DevLiv

画像はonLoad機能に表示されません

答えて

関連する問題