div旋轉(zhuǎn)動(dòng)畫為什么以下代碼實(shí)現(xiàn)不了?
.image_2 figcaption div
{
border:2px solid #fff;
width: 80%;height: 80%;
position: absolute;
top: 10%;left: 10%;
-webkit-transform:translate(0px, 0px) rotate(0deg);
-moz-transform:translate(0px, 0px) rotate(0deg);
transform:translate(0px, 0px) rotate(0deg);
}
.image_2:hover figcaption div
{
border:2px solid red;
-webkit-transfrom:translate(0px, 0px) rotate(720deg);
-moz-transfrom:translate(0px, 0px) rotate(720deg);
transfrom:translate(0px, 0px) rotate(720deg);
}
為什么div中的邊框不能實(shí)現(xiàn)旋轉(zhuǎn)了呢?鼠標(biāo)選中的時(shí)候,邊框的顏色變了,可是沒(méi)有旋轉(zhuǎn)的效果。求教,困擾了幾天的問(wèn)題(我使用的是chrome的最新瀏覽器),謝謝。
2015-12-31
親,你的問(wèn)題應(yīng)該是沒(méi)有設(shè)置過(guò)度的持續(xù)時(shí)間這一項(xiàng):transition:all 1s
務(wù)必要寫過(guò)度的原因是:你設(shè)置的旋轉(zhuǎn)度數(shù)是一個(gè)周期像360/720這些的換到原位的動(dòng)畫,所以只有有持續(xù)時(shí)間你才可以看到他的旋轉(zhuǎn)過(guò)程。
你可以設(shè)置其他不適這些的,如30,60,70,等等都可以達(dá)到動(dòng)畫旋轉(zhuǎn)的效果。
2015-09-15
.image_2 figcaption div 及 .image_2:hover figcaption div
的 transform:translate(0px, 0px) ,您都設(shè)為0 ,當(dāng)然不會(huì)旋轉(zhuǎn)了
可以把其中一個(gè)設(shè)為translate(0,-350px) 看看喔^^
2015-09-04
rotate需要先定義 transform-origin?屬性的值