JQuery исчезает в свойстве цвет фона при наведении?

Question

У меня есть небольшой фрагмент кода, который не работает, посмотрите:

$(document).ready(function() {
    $('ul#mainmenu li:hover').css({backgroundColor:''});
    $('ul#mainmenu li').hover(function() {
        $(this).animate({backgroundColor:'#2E8AE5'}, slow);
    });
});

Он предназначен для:

1) сброса свойства CSS background-colorиз элемента списка с псевдоклассом :hover в неупорядоченном списке с идентификатором mainmenu (так что те, у кого не включен Javascript, могут по-прежнему испытывать эффект, подобный тому, что я пытаюсь достичь с помощью jQuery)1009 * 2) Когда тот же элемент списка затем наведен, он должен анимироваться в цвет фона на указанном элементе списка.

Но это не так.Вместо этого первая задача даже не выполнена, не говоря уже о анимации в фоновом режиме при наведении.Стоит отметить, что я трижды проверил свои элементы (я даже скопировал их и вставил в сценарий, чтобы убедиться).

И я использую пользовательский интерфейс jQuery, который, как я понимаю, может выполнять такие задачи, включая анимацию определенных свойств CSS.Идеи?

Answer 1

Изменение целевого идентификатора на #mainmenu> li повлияет на него только на родительском уровне li, а не на дочернем li. Также попробуйте backgroundColor: «прозрачный! Важный»

Попробуйте это:

$(document).ready(function() {
    var $lis=$('#mainmenu > li');
    $lis.css({backgroundColor:'transparent !important'});
    $lis.hover(function() {
       $(this).animate({backgroundColor:'#2E8AE5'}, 'slow');
    });
});

Answer 2

Как и , упомянутый ранее ... используйте плагин цвета

http://jsfiddle.net/Mb6Nd/

$(document).ready(function() {
    var lis = $('#mainmenu > li');
    $(lis).hover(
        function() {
            $(this).animate({backgroundColor:'#2E8AE5'}, 'slow');
        },
        function(){
            $(this).animate({backgroundColor:'#cecece'}, 'fast');
        }
    );
});

Answer 3

РЕДАКТИРОВАТЬ

Это должно быть 'background-color'.Не фоновый цвет.т.е.

$(this).animate({'background-color':'#2E8AE5'}, "slow");

---

Параметр скорости должен быть строкой или числом.Например: «медленно» или 10000 (миллисекунд).

например:

$(this).animate({backgroundColor:'#2E8AE5'}, "slow");

или

$(this).animate({backgroundColor:'#2E8AE5'}, 1000); // in millisecs

Answer 4

Я думаю, что это лучшее решение для затухания в цветах фона, передних и рамочных цветов, таких как плагин цветной анимации jQuery ,

Использование:

<\script type = "text / javascript" src = "http://www.bitstorm.org/jquery/color-animation/jquery.animate-colors.js">

(убрать обратную косую черту) .

и после введите коды до. like.

$('#demodiv').animate({backgroundColor: '#400101'});

Подробнее нажмите здесь

Answer 5

это работает?:

$(document).ready(function() {
    var $lis=$('#mainmenu li');
    $lis.css({backgroundColor:'#aaa'});
    $lis.hover(function() {
       $(this).animate({backgroundColor:'#2E8AE5'}, 'slow');
    });
});