如果你想从当前网页中删除CSS过渡，转换和动画，你可以执行我写的这个小脚本(在你的浏览器控制台):

let filePath = "https://dl.dropboxusercontent.com/s/ep1nzckmvgjq7jr/remove_transitions_from_page.css";
let html = `<link rel="stylesheet" type="text/css" href="${filePath}">`;
document.querySelector("html > head").insertAdjacentHTML("beforeend", html);

它使用vanillaJS来加载这个css文件。这里还有一个github repo，以防你想在刮板(Ruby-Selenium)的上下文中使用它:remove-CSS-animations-repo

做

$('#elem').css('-webkit-transition','none !important'); 

在你的js杀死它?

显然，每一个都要重复。

我认为你可以创建一个单独的CSS类，你可以在这些情况下使用:

.disable-transition {
  transition: none;
}

然后在jQuery中，你可以这样切换类:

$('#<your-element>').addClass('disable-transition');

添加一个额外的CSS类来阻止转换，然后删除它以返回到以前的状态。这使得CSS和JQuery代码都简短、简单、易于理解。

CSS:

.notransition {
  transition: none !important;
}

注意:添加!important是为了确保该规则具有更高的优先级，因为使用ID比使用class更具体。

JQuery:

$('#elem').addClass('notransition'); // to remove transition
$('#elem').removeClass('notransition'); // to return to previouse transition

我有一个类在你的CSS像这样:

.no-transition { 
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;
  -ms-transition: none;
  transition: none;
}

然后在jQuery中:

$('#elem').addClass('no-transition'); //will disable it
$('#elem').removeClass('no-transition'); //will enable it

如果你想要一个简单的非jquery解决方案来防止所有的过渡:

添加以下CSS:

body.no-transition * {
  transition: none !important;
}

然后在js中:

document.body.classList.add("no-transition");

// do your work, and then either immediately remove the class:

document.body.classList.remove("no-transition");

// or, if browser rendering takes longer and you need to wait until a paint or two:

setTimeout(() => document.body.classList.remove("no-transition"), 1);

// (try changing 1 to a larger value if the transition is still applying)