Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JAVA]Urycie jednego div z jednoczesnym odkryciem drugiego
Xylonik
post 2.10.2008, 09:36:50
Post #1





Grupa: Zarejestrowani
Postów: 2
Pomógł: 0
Dołączył: 30.09.2008

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


Witam wszystkich!
Na początek informuję, że to mój pierwszy post, i że post umieszczam go w przedszkolu więc proszę o wyrozumiałość, litość i pomoc.
Do rzeczy.
Chciałbym odkrywać jednego div-a z jednoczesnym ukryciem drugiego
Np. Mam (znalazłem) taki kod który działa prawie tak jakbym chciał tyle tylko, że nie wiem jak jednocześnie ukrywać <div id="menus"> przy odkryciu <div id="menus1" style="display: none;" >

<script type="text/javascript">
function openClose(id){
if(document.getElementById) {
element = document.getElementById(id);
} else if(document.all) {
element = document.all[id];
} else return;

if(element.style) {
if(element.style.display == 'block' ){
element.style.display = 'none';
} else {
element.style.display = 'block';
}
}
}
</script>
<div id="menus">
<a href="java script:void(0); openClose('menus1'); " style="cursor:poitnter">Przykład 1</a>
<div>
<div id="menus1" style="display: none;" >
To jest mój ukryty div.
<br>
<a href="java script:void(0); openClose('menus1'); " style="cursor:poitnter">Wróc</a>
</div>

czyli klikając -Przykład 1- odkrywam -To jest mój ukryty div.- a zakrywam -Przykład 1-
i dalej klikając -Wróć- odkrywam -Przykład 1- a zakrywam -To jest mój ukryty div.-

I może jeszcze jedno
Jakby to miało wyglądać gdyby dotyczyło to 16 div-ów z tym, że na dzień dobry widocznych by było np.8 same nieparzyste czyli 1,3,5....(Przykład 1, Przykład 2....) i kliknięcie na jeden z nich odkrywa jeden z parzystych gdzie jest -Wróć- a zakrywa wszystkie inne i analogicznie klikam -Wróć- zakrywam obecnie otwarty i wracam do sytuacji na dzień dobry.
To chyba wszystko
Jeszcze raz proszę o wyrozumiałość.
Pozdrawiam
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 4)
webdice
post 2.10.2008, 09:41:08
Post #2


Developer


Grupa: Moderatorzy
Postów: 3 045
Pomógł: 290
Dołączył: 20.01.2007




O bbcode Pan nie słyszał? Proszę dodać odpowiednie.
Go to the top of the page
+Quote Post
Cienki1980
post 2.10.2008, 09:43:16
Post #3





Grupa: Przyjaciele php.pl
Postów: 1 590
Pomógł: 40
Dołączył: 11.01.2007
Skąd: Centrum

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


Po pierwsze Java!=JavaScript a Tobie właśnie chodzi o JavaScript.
Co do tego problemu polecam Ci zajrzeć od razu do jQuery .. tam szybciej znajdziesz rozwiązanie .. jeżeli dobrze kojarzę to slideToggle() załatwi sprawę.


--------------------
404
Go to the top of the page
+Quote Post
palin
post 2.10.2008, 13:49:26
Post #4





Grupa: Zarejestrowani
Postów: 2
Pomógł: 0
Dołączył: 2.10.2008

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


Kod
   window.onload = Laduj; // po zaladowaniu strony wykonujemy funkcję 'Laduj()'
  
   function Laduj() { // ta funkcja jest po to żeby nie dodawać zdarzenia 'onclick' w linkach, bo to brzydko wygląda
   document.getElementById('pokaz').onclick = Pokaz; // po kliknieciu w link o id 'pokaz' uruchamiamy funkcje 'Pokaz()'
   document.getElementById('ukryj').onclick = Ukryj;  //  tutaj to samo tylko drugi link (ukrywający)
   }
  
   function Pokaz() {
   divs= document.getElementsByTagName('div'); // pobieramy wszystkie 'divy' do zmiennej 'divs'
   for(i=0; i<=divs.length; i++) // przelatujemy po wszystkich divach
       {
       divs[i].id= "div_"+i; // kazdemu 'divovi' przypisujemy id, w tym wypadku np. "div_0" nastepny "div_1" itd.
     if(i%2 == 0) divs[i].style.display = "block";  //zmieniamy style
              else divs[i].style.display = "none";
       }    
   }
  
   function Ukryj() {
   divs= document.getElementsByTagName('div');
   for(i=0; i<=divs.length; i++)
       {
       divs[i].id= "div_"+i;
       if(i%2 != 0) divs[i].style.display = "block";
              else divs[i].style.display = "none";
       }    
   }

  1. <div style="display: none;">0</div>
  2. <div style="display: block;">1</div>
  3. <div style="display: none;">2</div>
  4. <div style="display: block;">3</div>
  5. <a href="javascript: void()" id="pokaz">Pokaz</a>
  6. <a href="javascript: void()" id="ukryj">Ukryj</a>


Skrobnąłem taki kodzik, jak coś niezrozumiałe to pytaj :-)
Go to the top of the page
+Quote Post
Xylonik
post 20.10.2008, 11:14:27
Post #5





Grupa: Zarejestrowani
Postów: 2
Pomógł: 0
Dołączył: 30.09.2008

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


Wielki dzięki za podpowiedzi
Rozwiązałem to za pomocą jquery.
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: 18.07.2025 - 04:28