經過一個網站，看到滑屏的時候有個進度條提示，似乎挺有效果。記得w3school曾經講過這個。

稍加修改，做在我這個模板裏麵。

滑屏進度條實現

先設置css

.progress-container {
  display:none;
  position: fixed;
  top: 0;
  z-index: 1;
  width: 100%;
  background-color: #f1f1f1;
  width: 100%;
  height: 4px;
  background: #ccc;
}

.progress-bar {
  height: 4px;
  background: #f44336;
  width: 0%;
}

再在頁麵弄個div

<div class="progress-container" id="scrollbar">
	<div class="progress-bar" id="progress-bar"></div>
</div>  

<script>

window.onscroll = function() {scrollFunction()};

function scrollFunction() {
  
  var winScroll = document.body.scrollTop || document.documentElement.scrollTop;
  var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
  var scrolled = (winScroll / height) * 100;
  document.getElementById("progress-bar").style.width = scrolled + "%";
  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
        document.getElementById("scrollbar").style.display = "block";
    } else {
        document.getElementById("scrollbar").style.display = "none";
    }    

}


</script>

一個小的進度條就實現了。可以有變化，比如這個進度條弄成漸變色的，不過我也不需要這麼花哨。如此就好。

通關文之誇揚關

老祖曰：多言數窮，不如守中。
至聖曰：君子欲訥於言而敏於行。
《玉樞經》曰：以誠而入。
古仙曰：知者不言，言者不知。
此皆教人誠實用功，而不可虛張聲勢也。
夫修真之道，至精至細，最詳最深，必須審問慎思，極深研幾，功力日久，而後見真。
必須誌念堅固，腳踏實地，愈久愈勤，而後得真。
非可以似是而非、隔靴瘙癢，草草了事；非可以輕薄自滿、空搭虛橋而已。
若明道稍有些兒恍惚，行道稍有些兒懸虛，不但不能行，而且不能知。
故學道者，期必至於真知確見、真履實踐為貴歟。
世間糊塗學人，學下幾個功夫，自負有道，數黃道白，人前混說亂講；做過幾日搬弄，見的有些效驗，自謂得道，裝模做樣，目中無人。
凡此皆是賣弄精神，以不知為知，以不是為是，自誇其能，虛沽其名。
殊不知性命之學，原是為己，非是為人；原是顧內，非是顧外。
當未聞道之時，急欲求其知，須要細心辨別以窮理。
及其聞道之後，急欲求其行，須當潛修密煉以用功，始終一味，誠心辦事，別無二念。
所謂用誌不分，乃凝於神，更何有閑暇工夫在人前誇能喧揚，沽名釣譽哉？
吾勸真心學道者，速將誇揚關口打通。
如愚如訥，謹言慎行，莫持己長，莫圖虛名，以性命為重，真心實意前行。
未聞道者低頭學道，已聞道者低頭修道。
若到功果完滿之時，至誠前知，神通廣大，自不誇而人俱誇，自不揚而人皆揚。
方且百世而後，說者稱獎，聞者仰慕，永傳不朽，何須自誇自揚，以圖虛名哉？
否則，無而為有，虛而為盈，自是自足，欺己欺人，妄想成道，難矣。

此關即是目下流行的“低調”，多年前有機緣證到些許內景，一講出來就不可再見，正是此關，當年不曉。

其實以靈寶定觀經之得道七候而論，僅第一候：心得定易，覺諸塵漏便不易達到。

此候何意？任何變化心均定在觀照的狀態下，所謂泰山崩於前而不變色。視而不見，聽而不聞。

並非想象中那麼容易，隋唐第一條好漢李元霸就是懼怕雷聲，固然是小說，但也可知此候對於尋常人幾乎也是難以企及的。

故此觀之，若未有得道七候，也無可誇揚之處。此關過法，仍是虛心實腹可也

相关文章:

• 2018/10/31   網頁內嵌pdf文件以及生死關
• 2018/10/30   擁抱Bootstrap 4 –先整一個固定瀏覽條以及輕慢關
• 2018/10/29   Javascript實現左側共享條以及恥辱關
• 2018/10/24   點擊搜索框顯示熱門搜索以及暴燥關
• 2018/10/19   用DIVI按鈕令PDF文件鏈接強製下載以及妄想關