css3文章右邊的TOC菜單是怎么實(shí)現(xiàn)的
問題描述
RT,就比如這篇文章CSS3打造3D立方體 在Github找到一個(gè)toc但是不支持中文,例如我二級標(biāo)題是中文的話,生成的toc菜單定位到文中就錯(cuò)誤。 謝謝各位~
問題解答
回答1:根據(jù)正文的h1、h2、h3等不同層級,使用js來實(shí)現(xiàn)的。和標(biāo)題是不是中文應(yīng)該沒關(guān)系。你找到的那個(gè)toc就支持中文。我試過了。
回答2:它是以id來定位的。
如果只看文檔的話,應(yīng)該是
$(’#toc’).toc({ ’selectors’: ’h1,h2,h3’, //elements to use as headings ’container’: ’body’, //element to find all selectors in ’smoothScrolling’: true, //enable or disable smooth scrolling on click ’prefix’: ’toc’, //prefix for anchor tags and class names <----------此處生成id ’onHighlight’: function(el) {}, //called when a new section is highlighted ’highlightOnScroll’: true, //add class to heading that is currently in focus ’highlightOffset’: 100, //offset to trigger the next headline ’anchorName’: function(i, heading, prefix) { //custom function for anchor namereturn prefix+i; }, ’headerText’: function(i, heading, $heading) { //custom function building the header-item textreturn $heading.text(); },’itemClass’: function(i, heading, $heading, prefix) { // custom function for item class return $heading[0].tagName.toLowerCase();}});
相關(guān)文章:
1. javascript - 在ie下為什么會(huì)出現(xiàn)這種情況呢 《 無法獲取未定義或 null 引用的屬性“l(fā)ength”》 ?請大神指教。2. css右浮動(dòng)字的順序顛倒了3. javascript - 我是做web前端的,公司最近有一個(gè)項(xiàng)目關(guān)于數(shù)據(jù)統(tǒng)計(jì)的!4. html5和Flash對抗是什么情況?5. javascript - 只是想用node建立一個(gè)簡單的服務(wù)器6. MySQL主鍵沖突時(shí)的更新操作和替換操作在功能上有什么差別(如圖)7. javascript - vue過渡效果 css過渡 類名的先后順序8. javascript - vuejs+elementui 購物車價(jià)格計(jì)算,點(diǎn)擊加減號修改數(shù)量總價(jià)都不會(huì)改變,但是計(jì)算執(zhí)行了9. 數(shù)據(jù)庫 - Mysql的存儲(chǔ)過程真的是個(gè)坑!求助下面的存儲(chǔ)過程哪里錯(cuò)啦,實(shí)在是找不到哪里的問題了。10. javascript - 如何使用loadash對[object,object,object]形式的數(shù)組進(jìn)行比較
