簡(jiǎn)介:門戶網(wǎng)站頂部廣告、閱讀類網(wǎng)站“查看全文”,電商網(wǎng)站分類導(dǎo)航,都會(huì)應(yīng)用到展開與收起效果。本課程講解使用JavaScript、jQuery實(shí)現(xiàn)動(dòng)態(tài)效果、動(dòng)畫效果原理以及節(jié)點(diǎn)式查找控件的方法。通過(guò)效果展示與案例分析,讓你掌握不同類型展開與收起效果的實(shí)現(xiàn)。
第2章 點(diǎn)擊按鈕控制展開與收起
仿京東篩選頁(yè)的展開與收起效果,使用HTML/CSS實(shí)現(xiàn)靜態(tài)布局,使用JavaScript實(shí)現(xiàn)動(dòng)態(tài)效果。
第3章 定時(shí)展開與定時(shí)收起效果
通過(guò)大幅廣告動(dòng)態(tài)效果,講解定時(shí)展開和定時(shí)收起效果。
第4章 jQuery實(shí)現(xiàn)點(diǎn)擊按鈕展開和收起動(dòng)畫效果
講解jQuery方法實(shí)現(xiàn)展開收起動(dòng)畫效果,掌握toggle()方法。
第5章 JavaScript實(shí)現(xiàn)多個(gè)展開與收起效果
仿照QQ閱讀的多個(gè)展開收起效果,講解parentNode、nextSibling、previousSibling屬性的使用。
第6章 回顧總結(jié)
通過(guò)回顧總結(jié),鞏固所學(xué)知識(shí),并靈活運(yùn)行所學(xué)知識(shí),擴(kuò)展技能。