13年11份把北京的工作辭了，出去從北到南找同學玩了二十多天，因為各種原因，回家（寧夏）找工作，想找一個Linux相關的工作，但涉及Linux的都是運維、支持一類，最后因為各種原因找了個做java的本地老公司，前后找了快一個月，並且之前都沒搞過java，只能答應人家自己學習能力好，三個月的試用期給我兩個月搞定java，兩月結束重新面試，老板說還行，OK！轉正。
現在三個月了，學習各種java周邊知識：js、jsp、html、CSS、Oracle數據庫……。這幾天比較閑，然后整理學過的知識，還是用我的MediaWiki，然后，然后就有了下面的。
閑話不多扯，看正題。
MediaWiki中是有目錄的，但是它被固定在標題下面，如果一篇文章太長，你看到中間，但又想條轉到其他目錄條，你需要回到目錄點擊要跳的目錄條，或者手動翻到目的地，shit！好麻煩，我不就想看我看的么，怎么這么費勁呢？
下面給出我的解決辦法：讓目錄懸浮起來，並且在不用時讓它自動折疊起來，方便閱讀和其他操作。自動折疊通過CSS的hover選擇器實現，當鼠標移動到目錄上時，目錄框自動變大。
代碼
先進入到下面頁面（也許你需要將localhost替換成其他的）：
http://localhost/mediawiki/index.php/MediaWiki:Common.css
在此頁你可以設置全局的css樣式，在這里加入如下：
#toc{ display: block; position: fixed; top: 100px; right: 0px; min-width: 100px; max-width: 350px; max-height: 20px; overflow-y: scroll; border: 1px solid #aaa; border-radius: 0 0 1px 1px; -moz-border-radius: 0 0 1px 1px; background: rgba(249,249,249,0.75); padding: 12px; box-shadow: 0 1px 8px #000; -webkit-box-shadow: 0 1px 8px #000; -moz-box-shadow: 0 1px 8px #000; } #toc:hover{ display: block; position: fixed; top: 100px; right: 0px; min-width: 100px; max-width: 350px; max-height: 500px; overflow-y: scroll; border: 1px solid #aaa; border-radius: 0 0 1px 1px; -moz-border-radius: 0 0 1px 1px; background: rgba(249,249,249,0.75); padding: 12px; box-shadow: 0 1px 8px #000; -webkit-box-shadow: 0 1px 8px #000; -moz-box-shadow: 0 1px 8px #000; } body { overflow-x: hidden;}
保存，清除瀏覽器緩存，看看如何！
簡直炫酷！哈哈。
關鍵點解釋
top: 100px; 目錄框到頂部距離
right: 0px; 目錄框到右邊框距離
min-width: 100px; 目錄框最小寬度
max-width: 350px; 目錄框最大寬度
max-height: 500px; 目錄框最大高度
background: rgba(249,249,249,0.75); 背景色和透明度
MediaWiki版本
1.20.2
在下面的參考中說是針對1.22以后版本，但我的1.20.2沒有問題。
效果圖
默認：
展開：
參考
http://blog.klniu.com/post/mediawiki-floating-directory-and-scroll/
2014
拿着不多的工資，干着不忙的工作！趕緊找個對象！煩透了回到家和見到親戚時他們的必問問題。
自己還列了一大堆需要學的東西，願自己不要辜負這大好青春！！！