下午好，吃完了娛樂(lè)圈里面的瓜，下面看一個(gè)導(dǎo)航菜單的小動(dòng)畫(huà)。
雖然圖片上看著不咋地，但是實(shí)際操作起來(lái)的話，還是挺有意思的
界面布局很簡(jiǎn)單，
寫(xiě)個(gè)ul li 然后 li 里面 嵌套一個(gè)ul
頁(yè)面布局寫(xiě)好，然后寫(xiě)CSS美化一下樣式。
當(dāng)觸摸第一級(jí)的li的時(shí)候下面的ul顯示。
因?yàn)橛蟹D(zhuǎn)效果。所以要給ul設(shè)置一個(gè)旋轉(zhuǎn)屬性。旋轉(zhuǎn)180度。
當(dāng)觸摸的時(shí)候旋轉(zhuǎn)角度為0度，為了效果不那么生硬，添加一個(gè)opcaity為0；觸摸時(shí)為1；
動(dòng)畫(huà)時(shí)間設(shè)置一下為0.6秒。
然后給第二級(jí)ul下面的li設(shè)置一下延時(shí)屬性。
http://www.xcyouyuan.com.cn/d/demo/jzh/
鏈接附上
關(guān)鍵詞:
