ugrás a tartalomhoz

Egyszerre nyíló és záródó oldalrészek JS-sel

thamas · 2007. Feb. 22. (Cs), 13.26
Szervusztok!

TomK32 oldalán találtam egy JQuery megoldást, amivel kinyíló és összecsukható oldalrészek készíthetők. Az ottani kódhoz lenne szükségem olyan kiegészítésre, amivel egyszerre nyitható, vagy zárható minden oldalrész. Gondolom, hogy nem egy bonyolult kód, de én sajnos nem tudok "JS-ül".

A TomK32 féle kód alapján készített teszt oldal (amit ki kellene egészíteni) a thamas.hu/teszt/vezbemtest.htm címen érhető el.

Köszönettel:

Hajas Tamás
‹ User oldali cache Joomla Getswider template probléma IE7-ben ›
 ■
1

Egyszerre nyíló oldalrészek

Balogh Tibor · 2007. Feb. 22. (Cs), 22.50
Remélem, ez jó lesz neked!

$(document).ready(function() {
  $("div.cv > .handler").click(function(){
     $(this).siblings().toggle();
  });

  $("#toggle").click(function(){
     $("div.cv > .handler").siblings().toggle();
  });
});


   <li><a href="#" id="show">Mindet mutatja</a></li>
   <li><a href="#" id="hide">Mindet elrejti</a></li>
   <li><a href="#" id="toggle">Mindet megváltoztat</a></li>
2

Köszi! Majdnem jó!

thamas · 2007. Feb. 23. (P), 12.47
Szia!

Köszönöm a kódot. Nekem ugyan csak a "mind változtat" funkció - ami egyébként nagyon jó ötlet! - működött, de bemásoltam még kétszer és kicseréltem a változókat meg az utasításokat "show"-ra meg "hide"-ra. Elég gányolós(?), meg hosszú is lett a kód, de így működik (thamas.hu/teszt/vezbemwork2.htm).

Aki ért hozzá, biztos tud rövidebbet. Thomas R. Koll (TomK32) is írt - kérdésemre - egy kiegészítő kódot, ez a témainditó hozzászólásban írt linken elérhető.

Köszönöm még egyszer!

Hajas Tamás
3

Szívesen!

Balogh Tibor · 2007. Feb. 23. (P), 16.09
Majdnem jó! - Az azért sejthető, gondolom, hogy direkt maradt ki a show és hide. Nem lehetett nehéz kitalálni, hogy mit kell másolni.

"Elég gányolós" - Miért lenne az? Ha három helyen, három különböző funkciót akarsz megadni, akkor Te ezt hogy' zsúfolnád egy sorba?

Köszönöm még egyszer! - Nincs mit!


Jaj! Most nézem, hogy mit írtál össze a kódokból. Legyen ez inkább!

<script type="text/javascript">
$(document).ready(function(){
	//Az összeset elrejti a lap megnyitásakor.
	$("div.cv > .handler").siblings().hide();

	//Fejezetcímen való kattintás
	$("div.cv > .handler").click(function(){
		$(this).siblings().toggle();
		//Ha hivatkozásra kattintott.
		return false;
	});

	$("#toggle").click(function(){
		$("div.cv > .handler").siblings().toggle();
		return false;
	});
	$("#hide").click(function(){
		$("div.cv > .handler").siblings().hide();
		return false;
	});
	$("#show").click(function(){
		$("div.cv > .handler").siblings().show();
		return false;
	});
});
</script>
Thomas R. Koll (TomK32) is írt - kérdésemre - egy kiegészítő kódot - És az mit csinál?
4

Mindtam, hogy nem tudok JS kódolni :o)

thamas · 2007. Feb. 25. (V), 14.23
A tudásom addig terjed, hogy felismerem a változókat és néhány egyszerűbb utasítást a kész kódban.

Miután láttad a kódomat, gondolom érted, mire mondtam, hogy gányolós... :o)

Amit most írtál szépen működik, eltekintve attól, hogy így nem váltják egymást a nyíló részek. Tehát ha kinyitok egyet, az nem zárja be a másikat...

TomK32 kódja annyit csinál, ami nekem eszembe jutott eredetileg: egyszerre nyitja vagy zárja az összes részt. Az általad kitalált váltás abban nincs benne. Továbbá nála a hivatkozás (a link) nem üres, hanem javascript utasítást tartalmaz, ami kicsit csúnyább megoldás, azt hiszem (bár ha nincs javascript a felhasználónál, akkor ennek a funkciónak nincs is értelme. Amiért annyira most nem fontos ez, mert egy belső, intranet hálóra kell a lap, nagyjából jól behatárolható felhasználói körrel.) A konkrét kód a fenti hivatkozásokon elérhető...

Egyébként küldött egy másik bejegyzést is, ezt még nem volt időm megnézni alaposan, de ez is egy hasonló funkció.
5

JavaScript nyitogatós kód kiegészítése

Balogh Tibor · 2007. Feb. 28. (Sze), 16.16
Szia Tamás!

Amit most írtál szépen működik, eltekintve attól, hogy így nem váltják egymást a nyíló részek. Tehát ha kinyitok egyet, az nem zárja be a másikat...

OK! Ez nekem nem jött le. Akkor az általad használt kódot kell alkalmazni a fejezeteken való klikkeléskor. Úgy véltem, ha van ilyen nyitogatós-csukogatós oldal, akkor én nem szeretném, ha egy már kinyitott részt, mindenképpen bezárna a kód, ha kell, ha nem. Bár ez az oldaltól függ, hogy melyik kódot érdemes használni. Az egyértelműség kedvéért:

    //Fejezetcímen való kattintás
    $("div.cv > .handler").click(function(){
        $("div.cv > .handler").siblings().hide(0);
        $(this).siblings().show("slow");
        //Ha hivatkozásra kattintott.
        return false;
    });
Remélem, így már sikerül a kívánt működést elérned!

A tudásom addig terjed, hogy felismerem a változókat és néhány egyszerűbb utasítást a kész kódban.

Megnyugtatásul, azért leírom, hogy az én JavaScript tudásom sem terjed igazán tovább.