html - 响应式布局延迟？

Question

我想知道您如何在响应式设计中创建“延迟”？

我的意思是，以网站awwwards.com为例。当您减小浏览器的宽度时，网站的响应会有一点延迟。

我会想象代码是这样的：

html, body {transition: all 0.2s ease-in-out;}

但显然它不是（......或者是吗？！）

只想将此效果应用于我自己的网站Blue Harlequin

Answer 1

它确实有transition: width 0.3s linear 0s;，但它在wrapper div.

Answer 2

像这样添加-webkit-transition: width 0.3s linear; 到您的.wCSS类

CSS：

.w {
    width: 960px;
    margin: 0 auto;
   -webkit-transition: width 0.3s linear;
   }

因为 .w 是所有元素的容器，所以将过渡添加到该类将使布局符合您的预期。