jQuery Spotlight Issue

Question

Im пытается вставить jQuery Spotlight snippet (от Dev7Studios) на моем сайте. Мне нужно разобраться со следующим сценарием:

Наведите указатель мыши на «Div A» и «Div B», чтобы получить подсветку. Мне нужно работать в режиме jQuery no conflict. До сих пор, сценарий я использую:

jQuery.noConflict(); 
jQuery(window).load(function() { 

    jQuery('#A, #B').bind('mouseover', function(){ 
     jQuery(this).spotlight({exitEvent:'mouseover', speed:600}); 

    }); 

}); 

С следующим сценарием, каждый из див получить подсвечивается при наведении курсора мыши, но мне нужно сделать это так, что, когда mouseovered, «Диво B» получает «Div A» подсвечен. Это было бы идеальным решением.

Возможное решение может быть также, что при наведении курсора мыши над на «Div A», «B» Div подсвечивается вместе с Div А.

В этот момент со сценарием у меня есть, только что Div становится выделен , в зависимости от того, что на нем наложено.

Любые идеи, пожалуйста?

Спасибо!

Answer 1

Просто вызовите селектор jQuery на #b после наведения указателя мыши на #a ... как показано ниже.

jQuery('#A').bind('mouseover', function(){ 
    jQuery('#B').spotlight({exitEvent: 'mouseover', speed:600}); 
}); 

Answer 2

Update на OP комментарий:

Вы можете создать карту, какие элементы воздействовать на других .. Может быть, воздействие Z, B воздействие A и т.д. Это определяется вами .. Тогда вам просто перебираем ценности МАП

Демо: http://jsfiddle.net/lucuma/4RFWQ/1/

var map = { 
"#A" : "#B", 
"#B" : "#A", 
"#Z" : "#A" 
}; 

jQuery.each(map, function(key, value) { 
    var val = value; 
    jQuery(key).on('mouseover', function() { 
     jQuery(val).spotlight({exitEvent:'mouseover',  speed:600}); 
    }); 

});​ 

Вы можете также цикл по массиву и связать

Оригинал:

Я думаю, что вы должны сделать что-то вроде этого, чтобы обобщить:

<div id="a" data-coord="b"></div><div id="b" data-coord="a"></div><div id="z" data-coord="b"></div> 

jQuery.noConflict(); 
jQuery(window).load(function() { 

jQuery('#A, #B').bind('mouseover', function(){ 
    jQuery('#' + jQuery(this).attr('data-coord')).spotlight({exitEvent:'mouseover', speed:600}); 

}); 

});