CSS过渡延迟不工作

Question

我正在尝试使图像在悬停时变得更大。然而，transition-delay属性似乎不起作用。图像是由object标签加载的，但是我也尝试过使用img标签。

小提琴

<div id="c_a">
<object data="https://lh6.ggpht.com/Rr2X9m8HrCIGJrOKG3MOr9pRYERaa4yBLWUTeB6YNgJVlseJSMIbFWDc9nX6O2Y9HeWRf-2qL1gy0TInmKtKfRIBAJVPK4eglImapFb9=s660" type="image/jpg"></object>
</div>

CSS:

#c_a object{
  transition: width 1s linear 2s, height 1s linear 2s;
  -webkit-transition: width 1s linear 2s, height 1s linear 2s;
  -o-transition: width 1s linear 2s, height 1s linear 2s;
  -moz-transition: width 1s linear 2s, height 1s linear 2s;
}
#c_a object:hover{
  width: 300%;
  height: 300%;
}

Answer 1

我有一个问题，过渡延迟不工作把transition-delay 放在 transition属性之后是很重要的!

transition:
transition-delay:

Answer 2

设置初始宽度和高度为100%。

#c_a object{
   width:100%;
   height:100%;
   // transitions..
}

工作小提琴

Answer 3

我的transition-delay也不工作，但corbacho的解决方案并没有为我做。但是，我发现如果我将transition更改为transition-duration，则它可以工作!

transition-duration:
transition-delay:

顺便说一下，顺序对我来说没有影响。