0

我有以下结构:

<div id="content-header">
<h1 id="title">Athletics Calendar</h1>
</div>

以及在 h1 标记之后添加一些链接的以下 jquery

$(document).ready(function() {
$("body[class*=page-calendar-practices] #content-header h1#title").after("<div id='athletics_practice-schedule'><div id='inner-title'><a href='calendar/practices/games' class='athletics_links'>GAMES</a><a href='calendar/practices' class='athletics_links'>PRACTICES</a></div></div>");

});

链接显示出来了,但是由于我需要在我插入的外部 div 上放置 -15px 的边距(将 div 上移...出于技术原因,我需要这样做),现在如果您将鼠标悬停在链接上什么都没有显示,但是如果您将鼠标悬停在它的正下方,它会显示。有没有办法解决这个问题?我另一个帖子有人建议使用下面的代码来修改链接,但它不起作用,没有任何改变颜色,所以我什至不确定如何使用它。

$(document).on('mouseenter', 'body[class*=page-calendar-practices] #content-header div#inner-title', function() {
$(this).css('color','red !important');
}).on('mouseleave', 'body[class*=page-calendar-practices] #content-header div#inner-title', function() {
$(this).css('color','blue !important');
});
4

2 回答 2

0

代码改变了#inner-titlediv 的颜色而不是其中的anchor标签,试试这个:

$('#content-header').on('mouseenter', '#inner-title a', function() {
      $(this).css('color','red');                                
}).on('mouseleave', '#inner-title a', function() {
     $(this).css('color','blue');
});

演示

于 2012-06-20T22:07:34.567 回答
0

要简单地将 div 向上移动 15px,更好的 css 应该是相对位置,顶部为 -15px。它将计算静态位置并添加-15的校正,以进行简单的解释。您能否检查这样做是否仍然会产生悬停问题。

于 2012-06-20T23:05:40.760 回答