【问题标题】:jQuery detect background color of a fixed elementjQuery检测固定元素的背景颜色
【发布时间】:2016-07-18 16:24:36
【问题描述】:

我有一个固定位置的白色菜单按钮。我的网站上有一个具有白色背景颜色的部分。我的目标是,当菜单按钮滚动到白色部分时,它会变成黑色而不是白色。

我只是不知道如何检测固定元素的背景颜色?这甚至可能吗?

这是我的 jQuery 的样子:

$color = how to detect bg color?;

if ($color == "#fff"){
    $("nav-icon2").css("color", "#000");
}else{
    $("nav-icon2").css("color", "#fff");
}

【问题讨论】:

标签: javascript jquery html css


【解决方案1】:

这是一个基于此解决方案的工作小提琴: How to get the background color code of an element?

See this fiddle

var color = '';
var x = $(".nav-icon2").css('backgroundColor');
hexc(x);
alert(color);

function hexc(colorval) {
    var parts = colorval.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
    delete(parts[0]);
    for (var i = 1; i <= 3; ++i) {
        parts[i] = parseInt(parts[i]).toString(16);
        if (parts[i].length == 1) parts[i] = '0' + parts[i];
    }
    color = '#' + parts.join('');
}

编辑:

如果我理解正确你的问题,你想要这个:

See this updated fiddle

$(window).scroll(function(){
    if($(window).scrollTop() > 350){
    $("h2").css('color','#f00');
  }else{
        $("h2").css('color','#fff');
  }
});

【讨论】:

  • 由于某种原因,我在控制台中收到“未捕获的类型错误:无法读取未定义的属性“匹配””
  • 这是与 OP 问题相关的正确答案,因为用户正在将值与#fff 进行比较,因此需要正则表达式。 +1(另外,在这种情况下,用户需要将其与#ffffff 进行比较)
  • @VincentG 我可以在 jQuery 中做同样的事情吗?
  • @FrankLucas:你先复制函数了吗?
  • @briosheje 是的,我做到了
【解决方案2】:

简单!

var $color = $('nav-icon2').css('background-color');

【讨论】:

    【解决方案3】:

    你可以这样做:

    $color = $( "your-element" ).css( "backgroundColor" );
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-05-11
      • 1970-01-01
      • 2021-10-11
      • 2013-12-30
      • 1970-01-01
      • 1970-01-01
      • 2011-04-17
      • 2012-01-30
      相关资源
      最近更新 更多