Dlaczego nie działa fadeIn ?

0

Dlaczego nie działa mi fadeIn ?


<HTML>
<HEAD>

<title>stronka</title>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>
	

$(document).ready(function(){


$("#szukaj").fadeIn(3000);



});

</script>


</HEAD>
<BODY>
	
<div id="szukaj" style="width:100%;height:20%;background-color: grey;"></div>



</BODY>
</HTML>
0

Wiesz, co tak właściwie robi fadeIn? ;-)

0

Na temat odpowiadaj w postach.

zmienia przeźroczystość elementu z ukrytego na widoczny

No właśnie - a czy ten Twój div jest ukryty? No nie jest.

Druga sprawa: ustaw mu sztywne wymiary (width:100px; height:100px), ponieważ 100% szerokości strony przy zerowej szerokości strony to zero pikseli, stąd też go nie widzisz.

0

To dlaczego te divy nie są ustawione jako ukryte a fadeIn działa ?

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("#div1").fadeIn();
        $("#div2").fadeIn("slow");
        $("#div3").fadeIn(3000);
    });
});
</script>
</head>
<body>

<p>Demonstrate fadeIn() with different parameters.</p>

<button>Click to fade in boxes</button><br><br>

<div id="div1" style="width:80px;height:80px;display:none;background-color:red;"></div><br>
<div id="div2" style="width:80px;height:80px;display:none;background-color:green;"></div><br>
<div id="div3" style="width:80px;height:80px;display:none;background-color:blue;"></div>

</body>
</html>
0

Dostrzegasz tam display:none, prawda?
display:none, które powoduje właśnie ukrycie danego elementu?

1 użytkowników online, w tym zalogowanych: 0, gości: 1