如何在jQuery中更改框阴影范围

Question

我如何更改框阴影宽度此代码

        $('#Range1').change(function () {
            $('.divwidth').css({ boxShadowX: this.value + 'px' });
            $('.divwidth').css({ 'boxShadowY': this.value + 'px' });
            $('.divwidth').css({ 'boxShadowBlur': this.value + 'px' });
        });

this.value+'px'=其在html范围中的可用性

Answer 1

从你的问题中找出一些例子，但试试这个。

$('#Range1').change(function () { $('.divwidth').css('boxShadowX', $(this).width()); $('.divwidth').css('boxShadowY', $(this).width()); $('.divwidth').css('boxShadowBlur', $(this).width()); });

或

$('#Range1').change(function () { $('.divwidth').css({boxShadowX: $(this).width(), $(this).width(), $(this).width()}); });

PX不是必需的，因为它是在PX 上计算的

请参阅此处：http://api.jquery.com/css/

Answer 2

jquery 1.8 之前

$('.divwidth').css({
            'color' : 'black',
            'background' : 'white',
            'border-radius' : '15px',
            'box-shadow' : '0px 0px 0px #444',
            '-moz-box-shadow' : '0px 0px 0px #444',
            '-webkit-box-shadow' : '0px 0px 0px #444',
        });

1.8之后，您可以使用

$('.divwidth').css({ boxShadow: '1px 3px 6px #444' })

你要找的是：

$('.divwidth').css({ boxShadow: '1px ' + this.value + 'px ' + '6px #444' })

boxShadow属性为boxShadow : horizontal(X) vertical(Y) blur shadow

Answer 3

在css boxShedowX boxShedowY中，boxShadowBlur样式不是

使用这个并将这些数字设置为dinamic；

.css({ boxShadow: '1px 3px 6px #444' });