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屬性之后放置transition-delay很重要！

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:

順便說一句，訂單對我沒有任何影響。