PHP/ Javascript ukrywanie/pokazywanie opisu.

Criss26 OP · 01-06-2015 18:15

Czesc.
Mam repertuar filmow: http://serwer1556037.home.pl/index.php?id=2
Filmy wypisywane sa za pomoca petli while, po uprzednim zapytaniu do bazy.
I teraz jest problem. Musze zrobic cos takiego, ze dla kazdego filmu, po kliknieciu w miniaturke ma sie pokazywac/ukrywac opis filmu w danym wierszu.
Zeby rozroznic kazdy wiersz zrobilem:
$i=1;
while ()
{
wypisuje tabele.
podczas wypisywania tabeli z opisem:
echo "<td id='$i'>" . $row[6] . "</td>";
$i+=1;
}

Tylko jak to teraz podpiac pod jakis javascript, zeby pokazywal/ukrywal sie opis z danego wiersza.

**zakius** · 01-06-2015 18:19

Możesz albo starym sposobem dodać onclick i przekazywać id elementu do pokazania (display none/block zmieniasz) albo dołączać event po wczytaniu skryptu, reszta to samo.
Jak dane chcesz dociągać to jeszcze ajax, jak masz to nie ma problemu

Mistrzu dragon · 01-06-2015 18:33

Co ty za opis wciśniesz w taką rameczkę?
Ja w ogóle tego nie widzę.

Może jakiś onHover + popup albo wyświetla się kawałek opisu i możesz sobie rozwinąć/zwinąć?

Criss26 OP · 01-06-2015 18:38

Pozniej zwieksze sobie miejsce na opis, narazie chodzi mi o to, zeby dzialalo :P

Mistrzu dragon · 01-06-2015 18:43

a to sorry :P
nie wiem jak w js ale w jquery wystarczy dodać klasę i zrobić toggle button czy co tam chcesz, easy peasy

Criss26 OP · 01-06-2015 18:49

No probuje w jquery, ale jak mam wypisywanie danych w petli while to jak kazdemu kolejnemu wypisanemu opisowi nadac inne id? Zeby przypisac pozniej button do kazdego opisu oddzielnie?

**zakius** · 01-06-2015 19:17

na pewno da się to zrobić jakoś w kontekście klikniętego elementu, jakiś jego child łapiesz i działa bez przekazywania id

Kod:

 document.onclick = function(evt) {
    var evt=window.event || evt; // window.event for IE
    if (!evt.target) evt.target=evt.srcElement; // extend target property for IE
    alert(evt.target); // target is clicked
  }

i masz w co kliknąłeś, z tego już wywleczesz jakoś odpowiedni podelement

Mistrzu dragon · 01-06-2015 19:18

Gdzieś z odmętów mojej strony, button działa, kwestia dostosowania jak.

Kod:

<html>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<script type='text/javascript'>
	$(window).load(function(){
		$(document).ready(function() {
			$('.show').click(function() {
				$(this).next('div').toggle("slow");
			});
			
			$('.hide').click(function() {
				$(this).parent().slideUp();
			});
		});
	}); 
</script>
<table border="1" width="50%">
	<tr>
		<td>x</td>
		<td>x</td>
		<td><button class="show">Pokaz/ukryj</button><div class="slidingDiv">gowienko</div></td>
	</tr>
	<tr>
		<td>y</td>
		<td>y</td>
		<td><button class="show">Pokaz/ukryj</button><div class="slidingDiv">gowienko1</div></td>
	</tr>
	<tr>
		<td>z</td>
		<td>z</td>
		<td><button class="show">Pokaz/ukryj</button><div class="slidingDiv">gowienko2</div></td>
	</tr>
</table>
</html>

Criss26 OP · 01-06-2015 19:44

@Mistrzu dragon ;
Troche pogrzebalem i dziala elegancko.
@zakius ;
Dla Ciebie tez rep+, dzieki wielkie Panowie!!

Mistrzu dragon · 01-06-2015 19:49

spoko tylko dopisz sobie w css

Kod:

.slidingDiv {
	display:none; 
}

bo wszystkie buttony masz otwarte , no i .hide w jquery nic nie robi tu chyba (kopiowałem na szybko)

Criss26 OP · 01-06-2015 19:58

Mistrzu dragon napisał

Cytat został ukryty, ponieważ ignorujesz tego użytkownika. Pokaż cytat.

spoko tylko dopisz sobie w css

Kod:

.slidingDiv {
	display:none; 
}

bo wszystkie buttony masz otwarte , no i .hide w jquery nic nie robi tu chyba (kopiowałem na szybko)

Tego wlasnie szukalem jeszcze, dzieki znowu xD Zaraz potestuje, musze to jeszcze podpiac pod miniaturki zamiast buttonow, ale z tym powinienem sobie poradzic.

Criss26 OP · 01-06-2015 21:54

@Mistrzu dragon ;
Chyba jednak nie dam rady.
Jesli dodam button obok diva, gdzie ma sie zmieniac opis, to wszystko jest okej. Jednak musze dodac ten button (albo cos innego) na miniaturce.Zeby po kliknieciu na nia opis sie chowal/pokazywal. Wiesz moze, jak trzeba zmodyfikowac ten skrypt, zeby tak zadzialalo?

2cztery7 · 01-06-2015 22:08

wrzuć kod (js) to postaram się pomóc

Criss26 OP · 01-06-2015 22:10

@2cztery7 ;
http://wklej.org/hash/810ac005d92/

Nie wiem czy sie polapiesz.
Skrypt zaczyna sie od 9 linii.
W linijce 70 jest miniaturka, do ktorej musze podpiac button/cokolwiek innego.
W linijce 76 jest div, zawierajacy opis.

2cztery7 · 01-06-2015 22:16

a jak wrzucisz obrazek w diva z klasą show?

Temat: PHP/ Javascript ukrywanie/pokazywanie opisu.

Narzędzia tematu

Oceń ten temat

PHP/ Javascript ukrywanie/pokazywanie opisu.

Informacje o temacie

Użytkownicy przeglądający temat

Podobne tematy

Zmiana opisu mikrofonu / Jak trwoga to do TORGA

Ukrywanie hasła sieci bezprzewodowej.

Zasilacz pomoc opisu.

Skrypt PHP - przesyłanie danych z formularza php do pliku .txt

[Poradnik] Ukrywanie danych, szyfrowanie wiadomości, ukrywanie tekstu w obrazie

Zakładki

Zakładki

Zasady postowania