Bootstrap框架中的下拉菜單組件是一個獨立的組件,具體來學(xué)習(xí)一下
創(chuàng)新互聯(lián)為客戶提供專業(yè)的做網(wǎng)站、網(wǎng)站建設(shè)、程序、域名、空間一條龍服務(wù),提供基于WEB的系統(tǒng)開發(fā). 服務(wù)項目涵蓋了網(wǎng)頁設(shè)計、網(wǎng)站程序開發(fā)、WEB系統(tǒng)開發(fā)、微信二次開發(fā)、手機網(wǎng)站制作設(shè)計等網(wǎng)站方面業(yè)務(wù)。
下拉菜單(Dropdown)
☑ LESS版本:對應(yīng)的源文件dropdowns.less
示例1
示例2
下拉菜單–屬性聲明式方法(一)
☑ 被點擊的菜單項鏈接或按鈕需要添加自定義屬性 data-toggle=”dropdown”
實現(xiàn)下拉菜單原理:
Dropdown插件加載時,對所有帶 有“data-toggle=dropdown”樣式的元素綁定了事件,用戶單擊帶有“data-toggle=dropdown”樣式的鏈接或按鈕時, 會觸發(fā)JavaScript事件代碼。當(dāng)用戶點擊帶有“data-toggle=dropdown”樣式的鏈接或按鈕時,下拉菜單的父容器(上面的示例是 “
下接菜單結(jié)構(gòu):
如果觸發(fā)下拉菜單的元素是一個鏈接元素,為了避免點擊鏈接,頁面跳到頂部,可以使用data-target="#"來替代href="#"
下拉菜單–JavaScript觸發(fā)方法
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持創(chuàng)新互聯(lián)。