Question

在点击filter: blur(2px);时如何向body添加属性button？单击关闭按钮时，从body中删除该属性？干杯

Answer 1

我想你想要这个：

点击按钮：

$("#btnid").click(function(){
  $('body').css("filter","blur(2px)");
});

删除：

   $("#closebtnid").click(function(){
      $('body').css("filter","");
    });

css() method

Answer 2

在 CSS 中创建2个类 - 一个有模糊，一个没有。

在 Javascript 中创建2个功能 - 1个 onclick 用于模糊按钮，1个 onclick 用于关闭按钮。这些函数应该改变 body 的类。

$('.button').click(function(){
    $('body').addClass('blur');
});

Answer 3

实际上最好添加或删除一个类而不是使用.css（）。首先，它将您的样式与业务逻辑分开（更容易维护）。同样addClass()比css()方法快。

css

   .blurfilter{
       /*your blur filter styles here*/
    }

jquery

$('.blurbutton').on('click', function(){
   $('body').addClass('blurfilter');
});

$('.unblurbutton').on('click', function(){
   $('body').removeClass('blurfilter');
});

//you also could toggle the class with one button
$('.togglebutton').on('click', function(){
   $('body').toggleClass('blurfilter');
});

Answer 4

您可以使用css()将任何css属性添加到所选项目

$('#button').click(function(){
   $('body').css("filter", "blur(2px)");
});

删除css属性

$('#button').click(function(){
   $('body').css("filter", "");
});

注意： #button是按钮的ID。

文档： http://api.jquery.com/css/

单击按钮时将背景css更改为模糊？

4 个答案: