Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][HTML] z-index
Forum PHP.pl > Forum > Przedszkole
Wolfie
Witam

Mam taki kawalek kodu :

  1. echo '<div id="gallery" class="gallery">'.
  2. '<div id="click"></div>'.
  3. '<div class="img_container" id="img_container" style="width:'.$width.'px; right:0px;">';
  4. if(!empty($_POST['dir'])) {
  5. for($i=$count-1; $i>=0; $i--) {
  6. echo '<img src="'.$imgs[$i].'">';
  7. }
  8. }
  9. echo '</div>';


ktory znajduje sie w div-ie o id="foto"

Jak widac z powyzszego kodu wewnatrz div-a o id="gallery" znajduje sie div o id="click" ktory ma taki kod css

  1. #click {
  2. border:1px solid red;
  3. position:absolute;
  4. z-index:2;
  5. height:360px;
  6. width:125px;
  7. float:left;
  8. }


Jego z-index jest uswationy tak zeby znajdowal sie przed wszystkimi - z perspektywy osi z - divami znajdujacymi sie na stronie.

No i teraz mam obsluge zdarzen w jquery dla divow :

[JAVASCRIPT] pobierz, plaintext
  1. $("#foto").click(function(){
  2. //jakis kod
  3. });
  4. $("#click").click(function(){
  5. //jakis kod
  6. });
[JAVASCRIPT] pobierz, plaintext


Problem polega na tym ze mimo tego ze div o id="click" jest ustawiony na z-index:2 to i tak po kliknieciu w niego nic sie nie dzieje, a wiem ze dzialanie funkcji ktora obsluguje jest poprawne, poniewaz gdy wstawie funkcjie ktora obsluguje zdarzenie #click.click pod pod klikniecie na #foto to wszystko smiga, wiec wydaje mi sie ze cos jest nie tak z tym z-index.....mimo ze kursor myszy wyraznie mi pokazuje ze znajduje sie nad divem o id="click"......mam nadzieje ze rozumiecie o co chodzi.....poprostu mimo tego ze div o id="click" znajduje sie nad wszystkimi innymi divami w dokumencie po jego kliknieciu nic sie nie dzieje, choc funkcja w js jest napisana poprawnie....
paw-e-l
Wrzuć na jakiś serwer i podaj link. Spróbuję to sprawdzić w firebug'u.
Wolfie
Prosze bardzo, mozesz to sprawdzic tutaj, wejdz w zakladke projekty, pozniej np wnetrza i kliknij w ktorys projekt ktory sie wysunie po kliknieciu na 'wnetrza', wtedy pojawi Ci sie czerwona ramka ktora jest divem o id="click"....

Po kliknieciu na ten div zdjecia powinny przesuwac sie w innym kierunku niz po kliknieciu na div o id="foto".....

Moze problem jest w tym ze div o id="click" jest wewnatrz diva o id="foto" ? no ale jesli jest z indeksem-z to chyba nie powinno to miec znaczenia....
paw-e-l
w skrypcie masz
Kod
// Obsluga galerii
$("#foto").click(function(){

spróbuj tak
Kod
// Obsluga galerii
$("#img_container").click(function(){
Wolfie
----------------------------------------------------
Ok, juz sobie poradzilem, poniewaz div o id="click" jest ladowany dynamicznie przez ajaxa to trzeba bylo zastosowac :

[JAVASCRIPT] pobierz, plaintext
  1. $('#click').live("click", function {..
[JAVASCRIPT] pobierz, plaintext


zamiast
[JAVASCRIPT] pobierz, plaintext
  1. $('#click').click( function {..
  2.  
[JAVASCRIPT] pobierz, plaintext


Pozdro

tylko ze teraz jak klikne na div o id="click" to wykonuja sie dwie funcke , i ta ktora jest dla id="click" i ta ktora jest dla id="foto" , pewnie dlatego ze div click jest w divie foto......da sie to jakos pogodzic , czy trzeba poprostu wstawic jeszcze jednego diva obok diva click i jemu przypisac funkcje z diva foto ?
paw-e-l
może zadziała winksmiley.jpg
[JAVASCRIPT] pobierz, plaintext
  1. $('#click').unbind().live("click", function {..
[JAVASCRIPT] pobierz, plaintext
Wolfie
nie, nie dziala tongue.gif, ale dzieki za pomoc, niestety nie moge jeszcze wstawic 'pomogl' winksmiley.jpg
zegarek84
Cytat(Wolfie @ 28.09.2009, 23:11:49 ) *
tylko ze teraz jak klikne na div o id="click" to wykonuja sie dwie funcke , i ta ktora jest dla id="click" i ta ktora jest dla id="foto" , pewnie dlatego ze div click jest w divie foto......da sie to jakos pogodzic , czy trzeba poprostu wstawic jeszcze jednego diva obok diva click i jemu przypisac funkcje z diva foto ?

poczytaj o stopPropagation() - może w jquery jest coś podobnego - a jeśli nie to ta strona dodatkowo powinna Cię zainteresować:
http://www.quirksmode.org/js/events_order.html
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.