+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: ukrywanie/pokazywanie części kodu (/thread-ukrywanie-pokazywanie-cze%C5%9Bci-kodu)
ukrywanie/pokazywanie części kodu - dam-pro - 17-07-2012
szukam skryptu, który pozwoli na ukrywanie/pokazywanie kilku fragmentów na raz, coś takiego:
KATEGORIE:
kat1, kat2, kat3, kat4, kat5, kat6, kat7, kat8, kat9, kat10, kat11..., katxx;
chcę, aby pogrubione części tekstu był domyślnie ukryta, a na końcu będzie przycisk "więcej" po kliknięciu w niego pokaże ukryte części tekstu i zamieni się na "mniej" /kliknięcie w mniej działa w 2 stronę//
ok, już znalazłem odpowiedni skrypt:
Kod:
<script type="text/javascript">
function wiecej(nazwy, x, mniej, wiecej, t,i,s){
for(i=0;i<nazwy.length;i++){
if(t=document.getElementById(nazwy[i])){
t.style.display=(s=t.style.display=='none')?'':'none';
}
}
x.innerHTML=s?mniej:wiecej
}
</script>Kod:
kat1, <div id="wiecej1" style="display: none">kat2, </div>kat3, kat4, <div id="wiecej2" style="display: none">kat5, kat6, </div>kat7, kat8, kat9, <div id="wiecej3" style="display: none">kat10, </div>kat11..., katxx; <br> <span onclick="wiecej(['wiecej1','wiecej2','wiecej3'],this,'Mniej','Więcej')">Więcej</span>tylko dlaczego ukryte części po kliknięciu "więcej" pokazują się w nowych linijkach??? wszystko powinno zmieścić się w 2 linijkach, a
zamiast tak:
kat1, kat2, kat3, kat4, kat5, kat6, kat7, kat8, kat9, kat10, kat11..., katxx;
pokazuje się tak:
kat1,
kat2,
kat3, kat4,
kat5, kat6,
kat7, kat8, kat9,
kat10,
kat11..., katxx;
dlaczego? jak to zmienić?
czy aby było poprawnie, każdy element oddzielnie muszę wziąć w "div" i nadać mu "float: left" ??? niby działa tak jak chcę, ale choć jestem początkujący wydaje mi się to dziwne, i sporo zachodu.. i na dodatek każdemu jakoś "spację" trzeba zrobić, to znowu wszystkim "margin: 0px 3px 0px 0px" ... / da się prościej? i tak w ogóle jest tu ktoś?
RE: ukrywanie/pokazywanie części kodu - camelrafal - 20-07-2012
z jquery sobie skorzystaj
Kod:
<h1 id="kat1">kat1</h1><p>cos tam cos tam</p>
<script>
$('#kat1').click(function(){ $('#kat1').next('p').slideToggle(); });
</script>dodatkowo jeszcze bedziesz miał w tym fajną animację
a co do tego że pokazuje się w wielu linijkach zamiast jednej to dlatego że div ma domyślnie ustawioną własność display na block
a block jest taki samolubny że nie chce sie z nikim dzielić miejscem i zrzuca kolegów piętro niżej
żeby tego uniknąć ustaw w divie
Kod:
display:inline;