[jQuery] Prosta galeria, Pomóżcie znaleźć błąd Opcje

[wdev]

Witam,

Uczę się jQuery i stwierdziłem, że zrobię prostą galerię jako moduł do Joomli. Założenie - jeden obrazek, na dole miniaturki i po naciśnięciu zmieniają główny. Nie wiem, co robię źle, ale jQuery zamiast zadziałać .click, w ogóle się nie odzywa. Pomoże ktoś znaleźć błąd?

[HTML] pobierz, plaintext 
(function($){
$('#jgallery_image_thumbs a').click(function(){		
    var mainPath = $(this).attr('href');
    var mainAlt = $(this).attr('title');
 
    $('#jgallery_main_image img').attr({ src: mainPath, alt: mainAlt });
    $('#jgallery_main_image_title').html(mainAlt);
    return false;
	});
})(jQuery);
[HTML] pobierz, plaintext 

I odpowiadający fragment kodu HTML:

[HTML] pobierz, plaintext 
<div class="jgallery" />
<div id="jgallery_main_image">
  <img src="/images/stories/fruit/peas.jpg" alt="peas.jpg"  />
  <h2 id="jgallery_main_image_title">Peas</h2>
</div>
 
<div id="jgallery_image_thumbs">
  <ul>
    <li><a href="/images/stories/fruit/peas.jpg" title="Peas">
       <img src="/images/stories/fruit/peas.jpg" alt="peas.jpg"  />
    </a></li>
    <li><a href="/images/stories/fruit/cherry.jpg" title="Cherry">
       <img src="/images/stories/fruit/cherry.jpg" alt="cherry.jpg"  />
    </a></li>
    <li><a href="/images/stories/fruit/strawberry.jpg" title="Strawberry">
       <img src="/images/stories/fruit/strawberry.jpg" alt="strawberry.jpg"  />
    </a></li>
    <li>
    <a href="/images/stories/fruit/pears.jpg" title="Pears">
        <img src="/images/stories/fruit/pears.jpg" alt="pears.jpg"  />
     </a></li>
  </ul>
</div>
 
</div>
[HTML] pobierz, plaintext 

Z góry dzięki za pomoc, bo mnie już oczy bolą od tego szukania :/

[krowal]

Nie działa Ci dlatego, że kod JS wykonuje Ci się jeszcze zanim wyświetlisz linki i obrazki, zdarzenia 'click' nie są wtedy podczepiane do żadnego z tych elementów.

Ten kod:

[JAVASCRIPT] pobierz, plaintext 
<script type="text/javascript">
(function($){
	$('#jgallery_image_thumbs a').click(function(e){	
		window.alert('1');
    var mainPath = $(this).attr('href');
    var mainAlt = $(this).attr('title');
 
    $('#jgallery_main_image img').attr({ src: mainPath, alt: mainAlt });
    $('#jgallery_main_image_title').html(mainAlt);
    return false;
	});	
})(jQuery);
</script>
[JAVASCRIPT] pobierz, plaintext 

daj na samym końcu tej strony, albo zostaw tam gdzie jest, ale zmień na:

[JAVASCRIPT] pobierz, plaintext 
<script type="text/javascript">
$(document).ready(function(){
  $('#jgallery_image_thumbs a').click(function(e){	
		window.alert('1');
    var mainPath = $(this).attr('href');
    var mainAlt = $(this).attr('title');
 
    $('#jgallery_main_image img').attr({ src: mainPath, alt: mainAlt });
    $('#jgallery_main_image_title').html(mainAlt);
    return false;
	});	
})
</script>
[JAVASCRIPT] pobierz, plaintext 

Ewentualnie zamiast .click(function(){...}) możesz dać .live('click', function(){...})