18041 sujets
Questions générales et questions de débutants
Bonjour,
Je suis un peu novice en jquery ...
Je tente aussi de reprendre ce tuto pour le ré-adapter ultérieurement à un objet gallery.php.
Je mets de côté le loader....
Tout se passe bien mais pas moyen de faire entrer un fadeIn....
En respectant le code du tuto ...:
jQuery(function($){
var settings = {thumbsListId: "thumbs", imgViewerId: "imgViewer",
activeClass: "active", activeTitle: "Current Picture"};
var linksTab = $("#" + settings.thumbsListId).find("a"), fLnk = linksTab.eq(0);
$("#" + settings.thumbsListId).after('<p></p>').attr('id', settings.imgViewerId).append(
$(document.createElement('img')).attr({id: 'bigOne', alt: '', src: fLnk.attr('href')})
);
var imgViewer = $("#"+settings.imgViewerId), bigPic = imgViewer.children("img");
highLight = function(elt){
linksTab.removeClass(settings.activeClass).removeAttr('title');
elt.addClass(settings.activeClass).attr('title', settings.activeTitle);
}
bigPic.addClass('nofloat');
linksTab.click(function(e){
e.preventDefault();
$this = $(this), target = $this.attr('href');
if( bigPic.attr('src') == target) return;
highLight($this);
bigPic.load(function(){
imgViewer.html($(this).fadeIn(400));
}).attr('src' target);
});
});
Là, pas de fadeIn et curieusement mon image "centrale" recouvre ma liste de vignettes...
Si, en revanche je ne met pas de gestionnaire d'évènement bigPic.load tout va bien mais pas de fade bien entendu:
bigPic.attr('src', target);
Quelqu'un a-t-il une idée ?
Merci d'avance
Je suis un peu novice en jquery ...
Je tente aussi de reprendre ce tuto pour le ré-adapter ultérieurement à un objet gallery.php.
Je mets de côté le loader....
Tout se passe bien mais pas moyen de faire entrer un fadeIn....
En respectant le code du tuto ...:
jQuery(function($){
var settings = {thumbsListId: "thumbs", imgViewerId: "imgViewer",
activeClass: "active", activeTitle: "Current Picture"};
var linksTab = $("#" + settings.thumbsListId).find("a"), fLnk = linksTab.eq(0);
$("#" + settings.thumbsListId).after('<p></p>').attr('id', settings.imgViewerId).append(
$(document.createElement('img')).attr({id: 'bigOne', alt: '', src: fLnk.attr('href')})
);
var imgViewer = $("#"+settings.imgViewerId), bigPic = imgViewer.children("img");
highLight = function(elt){
linksTab.removeClass(settings.activeClass).removeAttr('title');
elt.addClass(settings.activeClass).attr('title', settings.activeTitle);
}
bigPic.addClass('nofloat');
linksTab.click(function(e){
e.preventDefault();
$this = $(this), target = $this.attr('href');
if( bigPic.attr('src') == target) return;
highLight($this);
bigPic.load(function(){
imgViewer.html($(this).fadeIn(400));
}).attr('src' target);
});
});
Là, pas de fadeIn et curieusement mon image "centrale" recouvre ma liste de vignettes...
Si, en revanche je ne met pas de gestionnaire d'évènement bigPic.load tout va bien mais pas de fade bien entendu:
bigPic.attr('src', target);
Quelqu'un a-t-il une idée ?
Merci d'avance