[jQuery] Trying Jquery
[jQuery] Trying Jquery
I'm a begginner in Jquery.
Today, i tried to copy the phatphusion Imagemenu.
After searching, consulting the docs and example, i finally work it out, but
it's also absolutly not otpimized.
Is there somebody outhere to enhance my code and maybe released it as a
finished plugin?
I will also kindly all positive critisism and explanation to enhance my
jquery coding.
Here is my code:
(function($){
$.fn.imageSlide = function(options) {
var defaults = {
openWidth: 310,
fx: "linear",
speed: 600
};
var options = $.extend(defaults, options);
return this.each(function() {
$("li").css("border-right: 2px solid #fff");
var elements = $("#imageMenu li a").length;
var closedWidth = $("#imageMenu li a").width()
var openSelected = options.openWidth;
var smallWidth = Math.round(((closedWidth*elements) - (openSelected)) /
(elements-1));
$("li", this).bind("mouseenter", function(e) {
sibs = $(this).siblings();
childPics = $(this).children();
$(this).add(sibs).stop();
childPics.animate({
width: openSelected
},defaults.speed,defaults.fx);
$(this).animate({
width: openSelected+2
},defaults.speed,defaults.fx);
sibs.animate({
width: smallWidth+2
},defaults.speed,defaults.fx);
}).bind("mouseleave", function(e){
if($("#imageMenu").find("li").hasClass("current")){
sibs = $("li.current").siblings();
childPics = $("li.current").children();
$("li.current").add(sibs).stop();
childPics.animate({
width: openSelected
},defaults.speed,defaults.fx);
$("li.current").animate({
width: openSelected+2
},defaults.speed,defaults.fx);
sibs.animate({
width: smallWidth+2
},defaults.speed,defaults.fx);
} else {
sibs = $(this).siblings();
childPics = $(this).children();
$(this).add(sibs).stop();
childPics.animate({
width: closedWidth
},defaults.speed,defaults.fx);
$(this).animate({
width: closedWidth+2
},defaults.speed,defaults.fx);
sibs.animate({
width: closedWidth+2
},defaults.speed,defaults.fx);
}
});
$("li").click(function(e){
if($(this).hasClass("current")){
$(this).removeClass("current");
} else {
if($("#imageMenu").find("li").hasClass("current")){
$(".current").removeClass("current");
$(this).addClass("current");
} else {
$(this).addClass("current");
}
}
});
});
};
})(jQuery)
--
View this message in context: http://www.nabble.com/Trying-Jquery-tp16048605s27240p16048605.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.