jquery - 从 :hover with . 获取 css 值 css() - jquery

标签 jquery css hover

所以我设置了一个具有不同背景的菜单:悬停颜色。按钮背景将为灰色,悬停按钮时 animate() 为其相应的颜色。

我可以像这样获取悬停在任何按钮上的原始默认颜色:

var origBackgroundColor = $(this).css('background-color');

但是是否可以从我设置的 css :hover 属性中获取颜色?我将为每个按钮设置 :hover 颜色,因为如果有人没有启用 JS,导航仍然会有 :hover 效果。

像这样(或者有其他方法):

var hoverColor = $(this).css('background-color:hover');

有什么想法吗?这可能吗?

最佳答案

我很确定,为了获得 :hover 伪的 background-color,它首先需要一个浏览器事件来应用样式。换句话说,我认为当您用鼠标悬停时您可以得到它,但在那之前不会。

可能是你可以等到用户悬停,然后抓取颜色,用默认值覆盖它,存储它以供将来引用,然后做你的动画,但这可能比简单地协调你的 JS 和CSS。

是这样的:http://jsfiddle.net/UXzx2/

    // grab the default color, and create a variable to store the hovered.
var originalColor = $('div').css('background-color');
var hoverColor;

$('div').hover(function() {
      // On hover, if hoverColor hasn't yet been set, grab the color
      //    and override the pseudo color with the originalColor
    if( !hoverColor ) {
        hoverColor = $(this).css('background-color');
        $(this).css('background-color',originalColor);
    }
      // Then do your animation
    $(this).animate({backgroundColor:hoverColor});
});

关于jquery - 从 :hover with . 获取 css 值 css() - jquery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4719421/

相关文章:

javascript - 如何有多个链接悬停颜色,每次鼠标悬停时都不同?

javascript - console.log($ ('.divs' ).click(<function>)) 显示一个 div 数组... click 方法是否返回它所作用的对象?

html - 只需要在 Angular 9 的分页器中为 mat-select-option 的 div 添加类或样式

html - 为所有网站内容 img src 添加前缀

jquery - Jquery 只播放一次声音

jquery - 如何给div添加.hover效果?

javascript - 尝试将值从 Jquery 传递到 PHP 时未定义索引名称

jquery - Bootstrap Tab Pane 滑动效果

javascript - jQuery:更改日期格式

css - Angular 4+ : How to use icons from svg file