Улучшите этот jQuery?

Question

Я jquery noob - используя easyslider 1.7 - кнопки над слайдером - так что эффекты путают jQuery ... используя простой show/hide прямо сейчас и отлично работает!

Я хочу улучшить следующий медиальный код, чтобы быть немного более красноречивым, если это возможно.

Я хотел бы, чтобы кнопки fadeIn/fadeOut находились на ползунке div, и остаются видимыми при наведении курсора на кнопки (которые плавают над ползунком div). Извините, не могу опубликовать HTML.

$('#prevBtn,#nextBtn').hide(); 
$("#slider").hover(
    function() { 
    $('#prevBtn,#nextBtn').show(); 
    }, 
    function() { 
    $('#prevBtn,#nextBtn').hide(); 
    } 
); 
$("#prevBtn").hover(
    function() { 
    $('#prevBtn,#nextBtn').show(); 
    }, 
    function() { 
    $('#prevBtn,#nextBtn').hide(); 
    } 
); 
$("#nextBtn").hover(
    function() { 
    $('#prevBtn,#nextBtn').show(); 
    }, 
    function() { 
    $('#prevBtn,#nextBtn').hide(); 
    } 
); 

Answer 1

Использовать переменные для хранения повторно используемых объектов и использовать селектор группировки CSS.

var buttons = jQuery('#prevBtn,#nextBtn'); 
var hide = function() { buttons.hide(); } 
var show = function() { buttons.show(); } 
jQuery("#slider, #prevBtn, #nextBtn").hover(show, hide);