tehSUPERADMIN
tehSUPERADMIN

Reputation: 279

jQuery - How to adjust CSS filter (blur)?

Haven't had much luck with this one. I have the following set via CSS on a div (let's call it div.test):

filter: blur(2px);
-webkit-filter: blur(2px);
-moz-filter: blur(2px);
-o-filter: blur(2px);
-ms-filter: blur(2px);

How can I adjust this via the .css function using jQuery. I'd like to set each of them to 0px. Thanks in advance for the help.

Upvotes: 15

Views: 34999

Answers (3)

kraysak
kraysak

Reputation: 1756

http://jsfiddle.net/mswy6/3/

                    $("img").css({
                            'filter': 'blur(0px)',
                            '-webkit-filter': 'blur(0px)',
                            '-moz-filter': 'blur(0px)',
                            '-o-filter': 'blur(0px)',
                            '-ms-filter': 'blur(0px)'
                        });

Upvotes: 4

Atber
Atber

Reputation: 465

$('.test')
.css({
   'filter'         : 'blur(0px)',
   '-webkit-filter' : 'blur(0px)',
   '-moz-filter'    : 'blur(0px)',
   '-o-filter'      : 'blur(0px)',
   '-ms-filter'     : 'blur(0px)'
});

Upvotes: 23

tckmn
tckmn

Reputation: 59273

Try something like this:

var filterVal = 'blur(0px)';
$('.test')
  .css('filter',filterVal)
  .css('webkitFilter',filterVal)
  .css('mozFilter',filterVal)
  .css('oFilter',filterVal)
  .css('msFilter',filterVal);

Upvotes: 7

Related Questions