Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Zmiana klasy elementu
Włodzimierz
post
Post #1





Grupa: Zarejestrowani
Postów: 10
Pomógł: 0
Dołączył: 30.11.2013

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

Witam.
Tworzę stronę wizytówkę swojej małej firmy, i potrzebuję wykonać rozwijane menu po kliknięciu na element.
Moim celem jest wykorzystanie jak najkrótszego kodu, czyli importowanie biblioteki nie wchodzi w grę.

Mniej więcej chce uzyskać taki efekt:
[HTML] pobierz, plaintext 
  1. <button>Menu</button>
  2. <div id="zm" class="klasa1">Linki<div>
[HTML] pobierz, plaintext

a po kliknięciu na button:
[HTML] pobierz, plaintext 
  1. <button>Menu</button>
  2. <div id="zm" class="klasa2">Linki</div>
[HTML] pobierz, plaintext


Szukając po internecie natrafiłem na coś takiego:
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.   <script>
  5.   function changeColor(newColor) {
  6.     var elem = document.getElementById("para1");
  7.     elem.style.color = newColor;
  8.   }
  9.   </script>
  10. </head>
  11. <body>
  12.   <p id="para1" style="color: red;">Some text here</p>
  13.   <button onclick="changeColor('blue');">blue</button>
  14.   <button onclick="changeColor('red');">red</button>
  15. </body>
  16. </html>
[HTML] pobierz, plaintext


Powyższy kod działa, lecz jedynie zmienia kolor, i potrzebuje dwóch buttonów. Próbowałem go zmodyfikować, lecz nic z tego nie wychodziło.

Proszę o pomoc (IMG:style_emoticons/default/smile.gif) Jeżeli będzie trzeba chętnie za jako taką pomoc zapłacę.
Pozdrawiam.
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
PrinceOfPersia
post
Post #2





Grupa: Zarejestrowani
Postów: 717
Pomógł: 120
Dołączył: 18.04.2009

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

Musi działać, pewnie nie umiesz tego używać (IMG:style_emoticons/default/wink.gif) (wrzuć to, co ci nie działa)

Btw:
Cytat
var h=document.getElementsByTagName("H1")[0];
var typ=document.createAttribute("class");
(...)
var h=document.getElementsByTagName("H1")[0];
var typ=document.createAttribute("class");

Copy-paste programming nie jest zbyt dobra technika, duplikujesz kod niepotrzebnie pisząc 2razy to samo.. (Lepiej wywalić duplikatu i przenieść kod przed if'a

EDIT:

A do podmiany klasy używa sie zmiennej className, nie musisz tworzyć ręcznie żadnych atrybutów

Spróbuj tak:

document.getElementById('identyfikator-elementu').className = 'klasa1 klasa2 klasa3';
(Do className możesz przypisać kilka klas oddzielonych stacjami)

Ten post edytował PrinceOfPersia 1.12.2013, 13:55:51
Go to the top of the page
+Quote Post

Posty w temacie
- Włodzimierz   Zmiana klasy elementu   30.11.2013, 20:43:08
- - com   http://www.w3schools.com/jsref/met_namedno...etnam...   30.11.2013, 21:09:08
- - Włodzimierz   Dzięki działa, ale niestety w jedną stronę. Co zro...   30.11.2013, 21:20:34
- - Crozin   CytatMoim celem jest wykorzystanie jak najkrótszeg...   30.11.2013, 21:24:39
- - Włodzimierz   Nie chcę importować biblioteki ze względu na czas ...   30.11.2013, 21:34:23
- - com   up dodaj sobie spr czy wywołana została już funkcj...   30.11.2013, 21:38:39
- - Crozin   CytatNie chcę importować biblioteki ze względu na ...   30.11.2013, 21:48:04
- - com   @up zgadzam się, ale ta średnia krajowa na sierpie...   30.11.2013, 21:56:03
- - Włodzimierz   @com eureka @Crozin o tym, że jQuery jest cachowa...   1.12.2013, 13:07:26
- - PrinceOfPersia   Musi działać, pewnie nie umiesz tego używać (wrz...   1.12.2013, 13:49:10
- - Włodzimierz   Nie wiem, czy Cię dobrze zrozumiałem (nie działa):...   1.12.2013, 14:17:24

« 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: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

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

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