Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [js] Animacja przy ładowaniu pliku
narki1
post
Post #1





Grupa: Zarejestrowani
Postów: 50
Pomógł: 0
Dołączył: 26.06.2007

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

Witam
Próbuję się uporać z takim problemem.
Używam formularza do ładowania zdjęć.
Normalnie obrazki się ładują i nie ma żadnego problemu.
Chciałbym aby po kliknięciu przycisku wyślij pojawiła się informacja ,że plik jest w trakcie ładowania.
Próbuję wykorzystać onsubmit i wtedy wyświetlać np. aminowanego gifa "ładowanie zdjęcia proszę czekać"
Ale tu pojawiają się schody bo wymyśliłem , że umieszczę obrazek gif w divie :
[PHP] pobierz, plaintext 
  1. <div id="mydiv" class="top-bar"><img src="logo.jpg" alt="" width="400" height="200" /></div>
[PHP] pobierz, plaintext

i będę zmieniał class w stylu:
[PHP] pobierz, plaintext 
  1. <form name='tests' method='POST' enctype='multipart/form-data' action='upload.php' onsubmit='anima()'> 
[PHP] pobierz, plaintext

i oczywiście funkcja js umieszczona w sekcji <head>:
[PHP] pobierz, plaintext 
  1. function anima()
  2. {
  3. document.getElementById('mydiv').className='top-bar-green';
  4. }
[PHP] pobierz, plaintext

no i styl :
[PHP] pobierz, plaintext 
  1.  
  2.         .top-bar-green{
  3.         visibility:visible;
  4. 	z-index:-1;
  5.         }
  6.   #mydiv{
  7. 	position:absolute;
  8. visibility:hidden;
  9. 		}
[PHP] pobierz, plaintext

No i schody bo nie działa. Jeśli chodzi o JS to jestem cienki i trochę nie wiem jak to ugryźć.
Go to the top of the page
+Quote Post
kreciko
post
Post #2





Grupa: Zarejestrowani
Postów: 99
Pomógł: 7
Dołączył: 17.02.2010

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

Wydaje mi się, że lepiej zamiast używania visibility:visible i visibility:hidden wykorzystać display:block, i display:none
Go to the top of the page
+Quote Post
narki1
post
Post #3





Grupa: Zarejestrowani
Postów: 50
Pomógł: 0
Dołączył: 26.06.2007

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

Tak czy inaczej po kliknięciu przycisku nic się nie wyświetla.
Go to the top of the page
+Quote Post
kreciko
post
Post #4





Grupa: Zarejestrowani
Postów: 99
Pomógł: 7
Dołączył: 17.02.2010

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

Konsola błędów coś wypluwa? Możesz podać szerszy kontekst gdzie tego wykorzystujesz? Na jakich plikach operujesz, jakie przyciski masz w formularzu?

Ten post edytował kreciko 24.08.2010, 14:58:26
Go to the top of the page
+Quote Post
narki1
post
Post #5





Grupa: Zarejestrowani
Postów: 50
Pomógł: 0
Dołączył: 26.06.2007

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

Witam
Pierwsze próby wyglądają obiecująco.
Zmieniłem arkusz CSS:
[PHP] pobierz, plaintext 
  1.    .top-bar{
  2.             display:none;
  3.         }
  4.         .top-bar-green{
  5.             display:block;
  6. 						z-index:-1;
  7.         }
  8.   #mydiv{
  9. 	position:absolute;
  10.  
  11. 	}
[PHP] pobierz, plaintext

Czyli zamieniam klasy ze sobą a nie id z klasą tak jak to było na początku.
Go to the top of the page
+Quote Post
« Następny starszy · JavaScript · Następny nowszy »
 

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

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 23.12.2025 - 03:21
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn