Question

以下所有内容均在OSX上的Chrome中进行测试。

查看本网站的主要图片我正在构建：http://www.appsbayou.se

正如您在加载页面时所看到的那样，图像看起来像是＆＃34;滑动＆＃34;它的正确位置。我不想要这种行为。

此页面背后的代码来自自定义wordpress主题，在这件事上我没有发言权。我唯一的工作就是修复图像，这样它就不会做动画＆＃34;。

在源代码中，我发现这些行是罪魁祸首：

$(this).css("width", new_img_width);
$(this).css("max-width", new_img_width);

其中$(this)表示<img>标记。这里没有.animate（）。那么为什么jQuery使用动画来简单地改变宽度/最大宽度呢？我怎样才能使这些线条成为瞬间呢？

Answer 1

除去

img {
transition: width 0.5s ease-in-out 0s, 
            left 0.7s ease-in-out 0s,
             right 0.7s ease-in-out 0s;
}

来自

http://www.appsbayou.se/wp-content/themes/customizr/inc/assets/css/orange.min.css?ver=3.1.24

第15行

Answer 2

如果您在图像上执行“检查元素”，您将看到它包含在一组采用轮播方案的div中。你可以做几件事。一种是编辑页面HTML并摆脱容器div。但就格式化而言，这可能会产生一些不必要的副作用。

另一种选择可能是迭代$(this)的父链并开始有选择地从包含div中删除类。例如，摆脱center-slides-enabled类，看看会发生什么。不知道更多关于轮播的结构（你正在使用缩小的Javascript包装器，所以很难知道发生了什么）我不能确切地说出正确的类是什么，但是通过一些试验 - 和-rorror我认为你应该能够很快找到你需要做的事情。

如何让jquery.css无法动画，而是立即进行更改？

2 个答案: