我有一个网格中的链接列表,以及这些链接的垂直菜单。我正在尝试链接这两组,以便当您将鼠标悬停在网格中的项目上时,菜单项也会突出显示,反之亦然。这是我到目前为止所得到的:
/* Grid */
<div class="pos-content count1"></div>
<div class="pos-content count2"></div>
<div class="pos-content count3"></div>
/* Menu */
<ul>
<li class="item177">Menu Link 1</li>
<li class="item178">Menu Link 2</li>
<li class="item179">Menu Link 3</li>
</ul>
<script type="text/javascript">
$(document).ready(function() {
$('div.count1').click(function() {
$("#item177").trigger("mouseover");
});
});
</script>
相关:Count the number of elements with a specific class, then add an ID that numbers them
答案 0 :(得分:1)
Haven没试过,但这可能会奏效:
$('.count1').hover(function(){
$('#item77').addClass('highlight');
}, function(){
$('#item77').removeClass('highlight');
});
答案 1 :(得分:0)
你可以试试这个
$(document).ready(function() {
$('div').hover(function() {
$("ul li").eq($(this).index()).trigger("mouseover");
}, function() {
$("ul li").eq($(this).index()).trigger("mouseout");
});
$('ul li').hover(function() {
$(this).css('background-color', 'red');
}, function() {
$(this).css('background-color', 'white');
});
});