Question

尝试为类似于此网站的滑块中的背景设置动画 - http://www.legworkstudio.com/

我使用名为fullpage.js的插件添加了一个类＆＃34; fp-viewing - ＃＆＃34;根据选择的幻灯片（从0开始）到身体。

我似乎无法弄清楚为什么以下几行不起作用。我已经尝试过.animate + .css来做这件事。

if ($("body").hasClass("fp-viewing-1")) {
    $("body").animate({"background" : "red"}, 2000);
}

Answer 1

只需在你的身体元素上使用过渡

＆＃13;

document.getElementsByTagName('button')[0].onclick = function() {
  document.body.className = 'red';
};

＆＃13;

body {
  background-color: green;
  transition: background-color 2s;
  -webkit-transition: background-color 2s;
  -moz-transition: background-color 2s;
}

body.red {
  background-color: red;
}

＆＃13;

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <button>Change color</button>
    </body>
</html>

＆＃13;

根据班级淡化身体颜色

1 个答案: