在WordPress菜單中，我想爲子菜單內容添加頂部和底部箭頭以滾動

對於子菜單，我使用的是position：absolute，因此子菜單出現在主菜單的右側。但是，與位置：絕對滾動不出現。在WordPress菜單中，我想爲子菜單內容添加頂部和底部箭頭以滾動

有什麼辦法可以讓滾動條出現在子菜單上達到一定的高度後？

這裏是我的CSS：

.main-navigation{ 
    float:left; position:relative; padding-left:3.071em; z-index:9999; 
} 
.main-navigation ul{ list-style:none; font-family:"Century Gothic";} 
.main-navigation li{ text-transform:lowercase; display:block;} 
.main-navigation li a{ 
    display:block; color:#000;line-height:18px; 
    padding:0 4em 0 1.429em;} 

.main-navigation li ul{ 
    display:none; position:absolute; z-index:1; top:1px; left:90%; 
} 
    .main-navigation li ul li{ 
     line-height:18px; margin:0 1em 0.143em 0; 
    } 
    .main-navigation li ul li a { 
     display: inline-block; 
     line-height:14px; 
     padding: 0 2em; 
     width: 10.429em; margin:0 0 0 1em; 
     white-space: normal;   
    } 

.submenu .current-menu-item a{ 
    background:url(images/current-page.png) no-repeat left; } 

.main-navigation .current-menu-item > a, 
.main-navigation .current-menu-ancestor > a, 
.main-navigation .current_page_item > a, 
.main-navigation .current_page_ancestor > a { 
     background:url(images/current-page.png) no-repeat left; 
    } 

.sub-menu { height:80px; position:relative; display:block;} 

.main-navigation li.current_page_item ul, 
.main-navigation li.current_page_parent ul, 
.main-navigation li.current_page_ancestor ul { display: block; }

來源

2013-04-29 psuparna

這是很難回答這樣一個問題，沒有看到的頁面，或者至少是相關的HTML。但也許你可以嘗試這樣的事情？

.sub-menu {height:80px; overflow: auto;}

來源

2013-04-29 09:33:18

感謝您的回覆。你可以在這裏看到臨時網站：http://www.trialhosting2.info/beraldocms/?page_id=89 – psuparna 2013-04-29 10:13:57

感謝您的鏈接。我在上面發佈的代碼在我的網站上測試時工作。你試過了嗎？ – 2013-04-29 10:48:16

我已經嘗試了上面的代碼：http://trialhosting2.info/submenu/sample.html（無需向子菜單添加滾動條類）。這裏是另一個鏈接，我添加了滾動條類：http://trialhosting2.info/submenu/sample2.html添加滾動條類後，子菜單消失了。你可以看到我在頁腳上添加的腳本。當我從.main-navigation裏移除位置：絕對http://trialhosting2.info/submenu/sample3.html。請告訴我。 – psuparna 2013-04-29 11:43:22

在WordPress菜單中，我想爲子菜單內容添加頂部和底部箭頭以滾動

回答

相關問題