Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JS] Fade out dla <div>
fredman
post 5.01.2010, 21:39:37
Post #1





Grupa: Zarejestrowani
Postów: 92
Pomógł: 0
Dołączył: 15.12.2006

Ostrzeżenie: (0%)
-----


Chciałem zrobić na mojej stronce prosty "preloadscreen". Znalazlem coś prostego w internecie:

w body mam takiego diva:

  1. <div id="kurtyna" style="position:absolute;z-index:99;width:100%;height:100%;background-color:black;top:0;left:0;">&nbsp;</div>




i taki skrypcik w headzie:

  1. <script type="text/javascript">
  2. onload = function() {
  3. document.getElementById('kurtyna').style.display = 'none';
  4. }



zupełnie nie znam javy ale z tego co rozumiem to to działa tak że dopóki strona nie jest załadowana to wyświetla się na całą stronę div "kurtyna" a gdy się załaduje to przestaje wyświetlać.

To mi pasuje ale pomyślałem, że fajnie by było gdyby wprowadzić na końcu fade out tego diva(czyli gdy strona się załaduje wtedy startuje fade out kurtyny) tak żeby wyszedł efekt pojawiania się strony. Da sie zrobić coś takiego jakoś łatwo ?

Ten post edytował fredman 5.01.2010, 21:40:20
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 5)
Fifi209
post 5.01.2010, 21:47:06
Post #2





Grupa: Zarejestrowani
Postów: 4 655
Pomógł: 556
Dołączył: 17.03.2009
Skąd: Katowice

Ostrzeżenie: (0%)
-----


java != javascript

Jeżeli chcesz łatwo możesz skorzystać z frameworka np. jQuery winksmiley.jpg


--------------------
Zainteresowania: C#, PHP, JS, SQL, AJAX, XML, C dla AVR
Chętnie pomogę, lecz zanim napiszesz: Wujek Google , Manual PHP
Go to the top of the page
+Quote Post
skowron-line
post 5.01.2010, 21:48:10
Post #3





Grupa: Zarejestrowani
Postów: 4 340
Pomógł: 542
Dołączył: 15.01.2006
Skąd: Olsztyn/Warszawa

Ostrzeżenie: (0%)
-----


Użyj do tego jakiejś biblioteki to zamkniesz to w max 2 liniach kodu.
http://mootools.net/docs/core/Fx/Fx.Tween#Element:fade


--------------------
I'm so fast that last night I turned off the light switch in my hotel room and was in bed before the room was dark - Muhammad Ali.
Peg jeżeli chcesz uprawiać sex to dzieci muszą wyjść, a jeżeli chcesz żeby był dobry ty też musisz wyjść - Al Bundy.

QueryBuilder, Mootools.net, bbcradio1::MistaJam
http://www.phpbench.com/
Go to the top of the page
+Quote Post
fredman
post 5.01.2010, 22:53:25
Post #4





Grupa: Zarejestrowani
Postów: 92
Pomógł: 0
Dołączył: 15.12.2006

Ostrzeżenie: (0%)
-----


ok, dzięki. użyłem skryptu jquery, który znalazłem w sieci :

  1. <script type="text/javascript">
  2.  
  3. $(window).load(function () {
  4. $("#kurtyna").fadeOut(400);
  5. });


ale przyszła mi do głowy kolejna modyfikacja. chciałbym uzależnić ten fade out nie od załadowania całej strony ale od załadowania wybranego elementu (innego diva, który ma tam jakieś swoje id).

Ten post edytował fredman 5.01.2010, 23:40:37
Go to the top of the page
+Quote Post
Pawel_W
post 5.01.2010, 22:54:50
Post #5





Grupa: Zarejestrowani
Postów: 1 675
Pomógł: 286
Dołączył: 15.06.2009
Skąd: Wieliczka

Ostrzeżenie: (0%)
-----


http://docs.jquery.com/Events

znajdź tam sobie load winksmiley.jpg
Go to the top of the page
+Quote Post
fredman
post 5.01.2010, 23:07:27
Post #6





Grupa: Zarejestrowani
Postów: 92
Pomógł: 0
Dołączył: 15.12.2006

Ostrzeżenie: (0%)
-----


widziałem to ale dalej nie wiem jak to przerobić. prawowałem zmieniać ten "window" w nawiasie na id elementu np. (#element) albo ('#element') ale to nie działa

Ten post edytował fredman 6.01.2010, 00:00:05
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 14.08.2025 - 11:04