jQuery sử dụng .animate() không làm bất cứ điều gì trong IE8

Question

Vì vậy, nó chính thức: Tôi ghét Internet Explorer. Có, tất cả các phiên bản đẫm máu của nó. :-D

Vì vậy, tôi không nghĩ rằng tôi đã làm bất cứ điều gì phức tạp ở đây, nhưng dường như tôi. Tôi có một loạt các mục danh sách trong một danh sách không theo thứ tự được tạo kiểu cho menu điều hướng và trong Firefox, Chrome, Safari và Opera, mọi thứ hoạt động tốt. Điều đáng lẽ xảy ra là khi bạn di chuột qua một mục điều hướng, nó sẽ sinh động một số tăng trưởng và tạo hiệu ứng thay đổi màu nền.

Không có gì xảy ra trong Internet Explorer 7/8.

Tôi nghĩ rằng nó chỉ gắn liền với chức năng animate, vì nếu tôi trao đổi .animate với .css, nó hoạt động.

http://project-cypher.net/wtf/ (* url bị xóa - giải quyết sự cố)

Ý tưởng?

Answer 1

Thay đổi thuộc tính hình ảnh động của bạn một chút bằng backgroundColor, paddingTop và paddingBottom, điều này sẽ làm việc:

$('ul.navigation li a').css('padding','0px 12px'); 
$('ul.navigation li a').hover(function() { 
    $(this).stop().animate({ 
     backgroundColor : '#336699', 
     'padding-top': 6, 
     'padding-bottom': 6 
    }, 150); 
}, function() { 
    $(this).stop().animate({ 
     backgroundColor: '#660000', 
     paddingTop: 0, 
     paddingBottom: 0 
    }, 150); 
}); 

CSS này:

ul.navigation li a { 
    padding: 6px 12px; 
    color: #fff; 
    text-decoration: none; 
    background: #600; 
} 

Answer 2

Nếu tôi thay đổi 'padding': '6px 12px' thành 'padding': '12px' có vẻ như nó hoạt động. Bạn có thể thử điều này và báo cáo nếu nó không hoạt động trên đầu của bạn?

Nó không hoàn hảo nhưng nó làm một cái gì đó, và giúp bạn gần gũi hơn một chút để sửa chữa nó.

EDIT: Dang, tự hỏi tại sao không. Làm việc ở đây. IE8. IDK, có lẽ bạn đã có giải pháp từ câu trả lời khác.

Answer 3

Tôi chạy vào vấn đề này bản thân mình, một ngày khác. Tôi không thể tìm ra lý do tại sao IE không hoạt động đúng đối tượng.

Câu trả lời rất đơn giản, mặc dù: sử dụng jQuery UI

jQuery UI bao gồm một plugin màu cải tiến mà thực sự hoạt động.

Kiểm tra những điều gọn gàng khác trong jQuery UI trong khi bạn đang ở đó - các nút, hộp thoại, quán bar, các tab, vv tiến