Dlaczego nie działa fadeIn ?

Odpowiedz Nowy wątek
2018-06-24 11:05

Rejestracja: 3 lata temu

Ostatnio: 1 tydzień temu

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>

Pozostało 580 znaków

2018-06-24 11:09
Moderator

Rejestracja: 12 lat temu

Ostatnio: 11 minut temu

Lokalizacja: Wrocław

0

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


zmienia przeźroczystość elementu z ukrytego na widoczny - Szymon137 2018-06-24 11:14

Pozostało 580 znaków

2018-06-24 11:15
Moderator

Rejestracja: 12 lat temu

Ostatnio: 11 minut temu

Lokalizacja: Wrocław

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.


edytowany 1x, ostatnio: Patryk27, 2018-06-24 11:16

Pozostało 580 znaków

2018-06-24 11:31

Rejestracja: 3 lata temu

Ostatnio: 1 tydzień temu

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>

Pozostało 580 znaków

2018-06-24 11:33
Moderator

Rejestracja: 12 lat temu

Ostatnio: 11 minut temu

Lokalizacja: Wrocław

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


edytowany 1x, ostatnio: Patryk27, 2018-06-24 11:33
Ok, nie zauważyłem. - Szymon137 2018-06-24 11:36

Pozostało 580 znaków

Odpowiedz

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