Question

我想根据我从数据库获取的值来更改框阴影颜色。

基本上我正在做的是：

if (dbValue==1)
      $('.myDivClass').css("box-shadow","0px 0px 30px #333333");
else
 $('.myDivClass').css("box-shadow","0px 0px 30px #999999");

对于浏览器支持，我也应该为-webkit -moz设置此值。

我认为这不受支持，并且它需要在某处使用插入值才能使其成为内部阴影。

我也搜索了jquery插件，我发现了boxShadow方法只改变了阴影颜色。有没有办法做到这一点？我错过了什么。我能做的就是用不同的内部box-shadow创建不同的css类，并使用jquery我可以在div中添加和删除类来更改box-shadow。在我看来这是另一种方法，但我想确保如果没有办法改变颜色

box-shadow: inset 0px 0px 20px #257d0d;

这个box-shadow直接？

Answer 1

你应该只是在元素中添加一个类。

CSS：

.boxShadow {
-webkit-box-shadow: inset 0px 0px 30px #333333;
-moz-box-shadow: inset 0px 0px 30px #333333;
box-shadow: inset 0px 0px 30px #333333;
}
.boxShadow2 {
-webkit-box-shadow: inset 0px 0px 30px #999999;
-moz-box-shadow: inset 0px 0px 30px #999999;
box-shadow: inset 0px 0px 30px #999999;
}

JavaScript的：

if (dbValue==1)
      $('.myDivClass').removeClass('boxShadow boxShadow2').addClass('boxShadow');
else
 $('.myDivClass').removeClass('boxShadow boxShadow2').addClass('boxShadow2');

正如你所看到的，如果你想让它成为一个插入的盒子阴影，我也会为你制作盒子阴影。

希望这有帮助。

修改 我修改了我的代码，以便在添加新课程之前删除每个课程，以防有人有一天需要它...

Answer 2

    .boxShadow {
    -webkit-box-shadow: inset 0px 0px 30px rgba(1,2,3,0);
    -moz-box-shadow: inset 0px 0px 30px rgba(1,2,3,0);
    box-shadow: inset 0px 0px 30px rgba(1,2,3,0);
}

$('#m-div').css('box-shadow').replace(/rgba\([1\s]+,[2\s]+,[3\s]+,[0\s]+\)+/g,'red')

我使用reg-ex，因为在某些浏览器中，可以使用不同的格式返回一种颜色，例如chrome中返回的透明度为rgba（0,0,0,0）

如何用jquery或某种方式改变内部阴影颜色？

2 个答案: