PTT
Submit
Submit
選擇語言
正體中文
简体中文
PTT
Web_Design
[問題] 請問關於css3 2d轉換的問題
作者:
sthermit
( )
2015-02-09 17:03:39
剛才在研究css
發現css3有辦法作出動畫效果
就先練習2D的轉換,參考了w3c上面的範例
目標是希望可以讓div可以變長變短
這是我寫的css
.accordion-content{
width:100%;
height:0px;
background:yellow;
transition:height 2s;
-moz-transition:height 2s; /* Firefox 4 */
-webkit-transition:height 2s; /* Safari and Chrome */
-o-transition:height 2s; /* Opera */
}
.accordion-content-hover{
height:200px;
}
可是剛才試過之後
發現跟我想像的不一樣
DIV的高度沒有改變,一直都固定顯示
當觸發改變的時候背景的黃色長度會慢慢變長到200px
可是我希望是整個都一起變化
請問應該怎麼修改?
謝謝各位
作者:
taiwan08
(save the one for all)
2015-02-09 17:20:00
先確認是不是你打錯 .accordion-content:hover
作者:
crossdunk
(推噓自如)
2015-02-09 17:23:00
:hover
作者:
taiwan08
(save the one for all)
2015-02-09 17:24:00
http://jsfiddle.net/102q7m3w/
其實我不懂妳說的"整個都一起變化"是什麼東西有變化以為要問的是CSS,結果連jquery都出現了不把整個網頁的原始碼丟上來嗎?
作者:
aspdoctor
(大崎)
2015-02-10 02:47:00
因為你動的只有容器的高度,裡面的東西當然就只是跟著容器一起滿出來,不知道你要的是什麼效果,如果跟我想的一樣那可以搭配transform的scale跟translate來做到
作者:
tw0517tw
(無冬夜)
2015-02-10 11:49:00
容器變大了 裡面的東西沒有變大阿
繼續閱讀
[問題] Joomla的粗淺問題
a321321
[問題] 網頁右側有空白問題
bluetree
[問題] 分析網站使用的工具
joshiya
[問題] max-width + max-height + hidden in iOS
carylorrk
[問題] 如何使用php會員卡的條碼產生出會員資料
cutemoonmoon
Re: [問題] mail內容提交到outlook 變成亂碼 贈3000P
oToToT
[問題] 關於slider幻燈片的全屏效果
gili1103
Fw: [徵才] 台灣360徵網站前端工程師
avhacker
[問題] 如何利用公開資料自製 RSS
lkhuang
[問題] mail內容提交到outlook 變成亂碼 贈3000P
noworneverev
Links
booklink
Contact Us: admin [ a t ] ucptt.com