看板 Web_Design 關於我們 聯絡資訊
問題是這樣的 小弟最近剛開始學Vue 想說寫個簡單的篩選功能 功能是有了,只是我想加上淡入淡出的效果就失敗了 我是用Bootstrap的grid + Vue grid的部分用v-for跑迴圈 還是有更好的做法 還請各位前輩批評指教 期望效果: 切換類別時將目前畫面的圖淡出後再把切換到的圖片淡入進來 附上小弟練習的code https://goo.gl/HFf2Qw -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 220.132.226.51 ※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1531813673.A.EBE.html
fukinhot: fadein fadeout css要自己寫, vuejs 有提供transition 07/17 20:16
fukinhot: 的component給你包, 會給你各時機的class用, ,資訊請 07/17 20:16
fukinhot: 谷歌 vuejs enter/leave & list transitions 07/17 20:16
azrael60532: 我有試過用<transition></transition>包起來 07/17 21:47
azrael60532: 也有自己寫CSS 可是它只有淡入有效果 淡出沒有 07/17 21:49
azrael60532: 因為v-show的關係grid直接display:none 就沒有效果了 07/17 21:50
fukinhot: 睡前十分鐘幫你小改一下 codepen.io/chaoliou/pen/xJOVj 07/17 23:35
fukinhot: 這個才對 codepen.io/chaoliou/pen/xJOVjm 07/17 23:36
azrael60532: 感謝大大幫忙 可是這樣有個問題就是 07/18 12:38
azrael60532: 你選狗或是兔子的時候 前面會空下來 grid不會消失 07/18 12:39
fukinhot: 那是為了方便我確認淡入淡出的 07/18 19:33