Я пишу быстрый плагин (один из моих первых), чтобы помочь с кнопками, если JS включен:
(function ($) {
$.fn.extend({
chemButton : function (options) {
return this.each(function () {
myoptions = $.extend({ x: '0px', y: '0px', xHover: '0px', yHover: '0px', xActive: '0px', yActive: '0px' }, options);
var ob = $(this);
ob.addClass('chemButton');
var focus = false;
ob.mousedown(function() {
focus = true;
ob.children()
.css({ 'background-position' : myoptions.xActive + " " + myoptions.yActive })
.addClass('VBfocus')
.removeClass('VBHover');
});
ob.mouseup(function(){
focus = false;
ob.children()
.css({ 'background-position' : myoptions.xHover + " " + myoptions.yHover })
.removeClass('VBfocus')
.addClass('VBHover');
window.location.href = ob.find('a').attr('href');
});
if (focus === false) {
ob.children().hover(function () {
ob.children()
.css({ 'background-position' : myoptions.xHover + " " + myoptions.yHover })
.removeClass('VBfocus')
.addClass('VBHover')
.find('a').addClass('VBHover');
}, function () {
if (focus === false) {
ob.children()
.css({ 'background-position' : myoptions.x + " " + myoptions.y })
.removeClass('VBfocus')
.removeClass('VBHover')
.find('a').removeClass('VBHover');
}
});
}
});
}
});
})(jQuery);
при использовании 2 отдельных кнопок с помощью моего плагина, т.е.
<script type="text/javascript">
$(document).ready(function(){
$('.panelButton').chemButton({ x: '0px', y: '0px', xHover: '0', yHover: '-30px', xActive: '0', yActive: '-60px' });
$('.panelButton2').chemButton({ x: '0px', y: '-30px', xHover: '0', yHover: '-60px', xActive: '0', yActive: '0px' });
});
</script>
последние объявленные параметры применяются к обеим кнопкам. Как применить только к элементу, для которого он предназначен?
Привет