Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript][PHP]Onclick - pojawianie się i znikanie div'a
qqwwq
post
Post #1





Grupa: Zarejestrowani
Postów: 52
Pomógł: 0
Dołączył: 14.09.2009

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


Witam,

Bawię się z nową stroną, chciał bym aby jak najwięcej opcji było tam dostępnych bez odświeżania strony, a najłatwiej to chyba osiągnąć za pomocą onmouseover, onclick oraz display: none > display: block. Do pewnego czasu to działało, po najechaniu czy po kliknięciu na dany przycisk itp, pojawiał się kolejny div w którym można było coś wpisać czy coś zobaczyć, wykombinowałem sobie nawet przy niektórych takie fajne X, które ponownie nadawały danemu div'owi atrybut display: none. Jednakże teraz muszę zrobić coś takiego, że po kliknięciu na jakiś przycisk, pokazuje się dany div, po ponownym kliknięciu na ten sam przycisk - ten div znowu znika. Po prostu potrzebuję mieć jeden przycisk zarówno do wyświetlania i chowania jakiegoś diva - jednakże nie wiem jak to oskryptować.

Problem pewnie popularny, jednakże nie mogę nigdzie znaleźć poprawnego rozwiązania - google pewnie je zna, ale nie mogę trafić frazy dzięki której mi je poda.


Z góry dziękuję za pomoc, pozdrawiam.
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
kefirek
post
Post #2





Grupa: Zarejestrowani
Postów: 781
Pomógł: 256
Dołączył: 29.06.2008

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


A tak
  1. <script src="http://code.jquery.com/jquery-latest.js"></script>
  2.  
  3. <script type="text/javascript">
  4.  
  5. $(document).ready(
  6. function()
  7. {
  8. $("#klik").click(
  9. function()
  10. {
  11. $("#pokaz").toggle();
  12. }).toggle(function() {
  13. $(this).text('schowaj');
  14. $(this).css("color","blue");
  15. }, function() {
  16. $(this).text("więcej");
  17. $(this).css("color","red");
  18.  
  19. });
  20. });
  21.  
  22.  
  23. </head>
  24. <p id="klik"><span style="color:red">Wiecej</span></p>
  25. <div id="pokaz" style="display: none">
  26. test test test test test test test test test test test test test test test
  27. test test test test test test test test test test test test test test test
  28. test test test test test test test test test test test test test test test
  29. test test test test test test test test test test test test test test test
  30. </div>
  31. </body>
  32. </html>
Go to the top of the page
+Quote Post

Posty w temacie


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

 



RSS Aktualny czas: 27.12.2025 - 09:37