Skip to main content
adicionou 81 caracteres ao conteúdo
Fonte Link
LipESprY
  • 4,6mil
  • 2
  • 21
  • 36

Vê se é disso que precisa:

<!DOCTYPE html>
<html lang="en" onmouseleave="abreModal()">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="style.css">

    <title>Document</title>
    <script type="text/javascript">
        function abreModal() {
            document.getElementById("openModal").style.opacity = "1";
            document.getElementById("openModal").style.display = "block";

        }
        function fechaModal(){
            document.getElementById("openModal").style.opacity = "0";
            document.getElementById("openModal").style.display = "none";
        }
    </script>
</head>
<body>

     <div id="openModal" class="modalDialog">
         <div>
            <a href="#close" title="Close" onclick="fechaModal();" class="close">X</a>
            <h2>Modal Box</h2>
            <p>1 paragrafo.</p>
            <p>teste teste teste  teste teste teste v</p>
        </div>
    </div>

</body>

O problema do seu código foi utilizar o nome close na sua função. Existe um método com este mesmo nome. Veja mais em:

Window close() Method

Repare que renomeei as suas funções, tirei os parâmetros das suas funções. Nesse contexto eles eram desnecessários e reorganizei seu código... Inclusive carregar as funções antes do carregamento da página em si.

Vê se é disso que precisa:

<!DOCTYPE html>
<html lang="en" onmouseleave="abreModal()">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="style.css">

    <title>Document</title>
    <script type="text/javascript">
        function abreModal() {
            document.getElementById("openModal").style.opacity = "1";
            document.getElementById("openModal").style.display = "block";

        }
        function fechaModal(){
            document.getElementById("openModal").style.opacity = "0";
            document.getElementById("openModal").style.display = "none";
        }
    </script>
</head>
<body>

     <div id="openModal" class="modalDialog">
         <div>
            <a href="#close" title="Close" onclick="fechaModal();" class="close">X</a>
            <h2>Modal Box</h2>
            <p>1 paragrafo.</p>
            <p>teste teste teste  teste teste teste v</p>
        </div>
    </div>

</body>

O problema do seu código foi utilizar o nome close na sua função. Existe um método com este mesmo nome. Veja mais em:

Window close() Method

Repare que tirei os parâmetros das suas funções. Nesse contexto eles eram desnecessários.

Vê se é disso que precisa:

<!DOCTYPE html>
<html lang="en" onmouseleave="abreModal()">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="style.css">

    <title>Document</title>
    <script type="text/javascript">
        function abreModal() {
            document.getElementById("openModal").style.opacity = "1";
            document.getElementById("openModal").style.display = "block";

        }
        function fechaModal(){
            document.getElementById("openModal").style.opacity = "0";
            document.getElementById("openModal").style.display = "none";
        }
    </script>
</head>
<body>

     <div id="openModal" class="modalDialog">
         <div>
            <a href="#close" title="Close" onclick="fechaModal();" class="close">X</a>
            <h2>Modal Box</h2>
            <p>1 paragrafo.</p>
            <p>teste teste teste  teste teste teste v</p>
        </div>
    </div>

</body>

O problema do seu código foi utilizar o nome close na sua função. Existe um método com este mesmo nome. Veja mais em:

Window close() Method

Repare que renomeei as suas funções, tirei os parâmetros desnecessários e reorganizei seu código... Inclusive carregar as funções antes do carregamento da página em si.

Fonte Link
LipESprY
  • 4,6mil
  • 2
  • 21
  • 36

Vê se é disso que precisa:

<!DOCTYPE html>
<html lang="en" onmouseleave="abreModal()">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="style.css">

    <title>Document</title>
    <script type="text/javascript">
        function abreModal() {
            document.getElementById("openModal").style.opacity = "1";
            document.getElementById("openModal").style.display = "block";

        }
        function fechaModal(){
            document.getElementById("openModal").style.opacity = "0";
            document.getElementById("openModal").style.display = "none";
        }
    </script>
</head>
<body>

     <div id="openModal" class="modalDialog">
         <div>
            <a href="#close" title="Close" onclick="fechaModal();" class="close">X</a>
            <h2>Modal Box</h2>
            <p>1 paragrafo.</p>
            <p>teste teste teste  teste teste teste v</p>
        </div>
    </div>

</body>

O problema do seu código foi utilizar o nome close na sua função. Existe um método com este mesmo nome. Veja mais em:

Window close() Method

Repare que tirei os parâmetros das suas funções. Nesse contexto eles eram desnecessários.