Bonjour à tous,
je n'arrive pas à résoudre un problème qui persiste : je voudrais que ma fonction s'applique à chaque élément "block" de mon script et en faite celle-ci fonctionne correctement, mais sur tous les .block
j'ai fais un cas isolé pour qu'on comprenne mieux le problème à l'adresse suivante :
http://internet.umour.free.fr/example.html
Voici le jQuery :
et le html:
si vous avez une petite idée... je pense avoir mal utilisé les $(this) mais je ne trouve pas d'ou..
je n'arrive pas à résoudre un problème qui persiste : je voudrais que ma fonction s'applique à chaque élément "block" de mon script et en faite celle-ci fonctionne correctement, mais sur tous les .block
j'ai fais un cas isolé pour qu'on comprenne mieux le problème à l'adresse suivante :
http://internet.umour.free.fr/example.html
Voici le jQuery :
<script type="text/javascript">
$(document).ready(function() {
function displayImage(domAAroundImgThumb)
{
if (!domAAroundImgThumb.hasClass('shown'))
{
var newSrc = domAAroundImgThumb.attr('href');
$('img.work-big-view').fadeOut('fast', function(){
$(this).attr('src', newSrc);
$(this).fadeIn('fast');
});
$('.work-view a').removeClass('shown');
$(domAAroundImgThumb).addClass('shown');
}
}
//hover 'other views' images management
$('.work-view a').hover(
function(){displayImage($(this));},
function(){}
);
//add a link on the span 'view full size' and on the big image
$(this, 'img.work-big-view').click(function(){
$('.work-view a.shown').click();
});
});
</script>
et le html:
<div class="block left">
<img class="work-big-view" src="http://www.star-bike.com/images/CB1000R_Side.jpg" alt="" />
<div class="work-view">
<a class="shown" href="http://www.star-bike.com/images/CB1000R_Side.jpg"><img src="http://t0.gstatic.com/images?q=tbn [langue]oEk0-s5S1y7NM:http://www.star-bike.com/images/CB1000R_Side.jpg" alt="" /></a>
</div>
<div class="work-view">
<a href="http://images.forum-auto.com/mesimages/675435/cb1000r-3quart.jpg"><img src="http://t3.gstatic.com/images?q=tbn:t563PIYvDrmJNM:http://images.forum-auto.com/mesimages/675435/cb1000r-3quart.jpg" alt="" /></a>
</div>
<div class="work-view">
<a href="http://images.motofan.fr/C/5/1/0/cb100r-032009_fs32488.jpg"><img src="data:image/jpg;base64,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" alt="" /></a>
</div>
<br class="clear" />
</div>
<br class="clear" />
<div class="block left">
<img class="work-big-view" src="http://kitsuney.free.fr/blog/blog/files/angry-monkey-739979.jpg" alt="" />
<div class="work-view">
<a class="shown" href="http://kitsuney.free.fr/blog/blog/files/angry-monkey-739979.jpg"><img src="http://t2.gstatic.com/images?q=tbn:go5OGgQBXf2UaM:http://kitsuney.free.fr/blog/blog/files/angry-monkey-739979.jpg" alt="" /></a>
</div>
<div class="work-view">
<a href="http://rhinoden.rangerup.com/wp-content/uploads/2010/08/Scared-Monkey1.jpg"><img src="http://t1.gstatic.com/images?q=tbn:S4t5fa0abdrzNM:http://rhinoden.rangerup.com/wp-content/uploads/2010/08/Scared-Monkey1.jpg" alt="" /></a>
</div>
<div class="work-view">
<a href="portfolio//big-logo.jpg"><img src="portfolio//min-logo.jpg" alt="" /></a>
</div>
<br class="clear" />
</div>
si vous avez une petite idée... je pense avoir mal utilisé les $(this) mais je ne trouve pas d'ou..