3

有人可以帮忙吗。我有这两个：

我希望文本在悬停时变为浅绿色，不悬停时变为白色，单击时变为红色。

$(".music").hover(
    function() {
        $(this).css('color','lightgreen');
    }, 
    function() {
        $(this).css('color', 'white');
    }
);

$(".music").click(function () { 
    $('#result').load('album_list_index.php');
    $(this).css({ 'color': 'red', 'font-size': '100%' });
});

先感谢您

交流电

注意：好的，对不起，我没有说清楚。

我需要 div 在没有鼠标悬停时是白色的 我需要它在鼠标悬停时是 gree 我需要它在单击时是红色的，并且在单击另一个按钮之前保持红色。

感谢大家的投入，特别是添加类和删除类案例，这是一个很好的课程，一旦我掌握了更多的技术，我就会使用。

4

4 回答 4

4

问题是当我单击该项目时它变成红色但然后它恢复为白色并且我将鼠标悬停在它上面

如果您希望click保持状态，则最好使用类。尝试这个：

a { color: white; }
.active { color: red; }
.hover { color: lightgreen; }

$(".music").hover(
    function() {
        $(this).addClass("hover");
    }, 
    function() {
        $(this).removeClass("hover");
    }
);

$(".music").click(function () { 
    $('#result').load('album_list_index.php');
    $(".music").removeClass("active");
    $(this).removeClass("hover").addClass("active");
});

示例小提琴

于 2012-04-13T11:02:36.720 回答
3

您可以使用 CSS 伪元素：:hover和:active.

或者，当使用 jQuery 时，使用.hover()and.click()方法。

于 2012-04-13T10:52:49.347 回答
2

只需将您的代码包装在 a 中$(document).ready(function() { // code here });即可。

于 2012-04-13T10:54:35.430 回答
1

推荐使用 CSS ......但仍然可以使用 jquery

  $(document).ready(function(){
        $(".music").mouseover(function() {
           if(!$(this).hasClass('dontchange')){
              $(this).css('color','lightgreen');
           }
        });
        $(".music").mouseout(function() {
               if(!$(this).hasClass('dontchange')){
                $(this).css('color', 'white');
             }
        }

        $(".music").click(function () { 
         $(this).addClass('dontchange');
        $('#result').load('album_list_index.php');
        $(this).css({ 'color': 'red', 'font-size': '100%' });
        });
        });
于 2012-04-13T10:56:10.213 回答