為了練習自己的JS、CSS基本功，這些天和MediaWiki干上了！^_^

下面是我的MediaWiki新添加的功能：

• 回到頂部
• 鏈接放大
• MediaWiki升級

回到頂部是很多網站的基本功能，只要網頁向下滾動一定位移，回到頂部按鈕就會出現在相對瀏覽器的固定位置。下面是我在MediaWiki中添加的回到頂部功能。

PS：在博客園中，也有回到頂部功能，但是它是固定死的，操作并不方便，您可以添加自己的回到頂部按鈕，方法與下面類似，只是在JS代碼中需要引入jquery，其代碼如下：

<script id="jquery_182" type="text/javascript" class="library" src="http://files.CUOXin.com/snowsolf/jquery.js"></script><script type="text/Javascript">var snowId = document.getElementById("footer");var solfId = document.createElement("a");solfId.setAttribute("id","gotop");snowId.appendChild(solfId);function goTop(){$(window).scroll(function(e) {if($(window).scrollTop()>200)$("#gotop").fadeIn(100);else$("#gotop").fadeOut(100);});};$(function(){$("#gotop").click(function(e) {$('body,html').animate({scrollTop:0},100);});$("#gotop").mouSEOver(function(e) {$(this).css("background","url(http://images.CUOXin.com/CUOXin_com/snowsolf/497956/o_backtop.gif) no-repeat 0px -100px");});$("#gotop").mouseout(function(e) {$(this).css("background","url(http://images.CUOXin.com/CUOXin_com/snowsolf/497956/o_backtop.gif) no-repeat 0px 0px");});goTop();});</script>

原理就是在頁面中找一個元素，然后在這個元素的父元素中插入“回到頂部”元素。CSS代碼同下，如果你想將原頁面中的固定回到頁面按鈕隱藏，則CSS代碼如下：

a[href="#top"]{    display:none;}

一般網站中都會有footer元素，你在footer元素中插入你想要的元素（回到頂部），然后對這個元素進行操作。

在ID為footer的元素中插入a：

var snowId = document.getElementById("footer");var solfId = document.createElement("a");solfId.setAttribute("id","gotop");solfId.setAttribute("title","回到頂部");snowId.appendChild(solfId); function goTop(){    $(window).scroll(function(e) {//若滾動條離頂部大于200元素    if($(window).scrollTop()>200)    $("#gotop").fadeIn(100);//以1秒的間隔漸顯id=gotop的元素    else    $("#gotop").fadeOut(100);//以1秒的間隔漸隱id=gotop的元素    });};$(function(){    //點擊回到頂部的元素    $("#gotop").click(function(e) {        //以1秒的間隔返回頂部        $('body,html').animate({scrollTop:0},100);    });    $("#gotop").mouseover(function(e) {        $(this).css("background","url(/images/backtop.gif) no-repeat 0px -100px");    });    $("#gotop").mouseout(function(e) {        $(this).css("background","url(/images/backtop.gif) no-repeat 0px 0px");    });    goTop();//實現回到頂部元素的漸顯與漸隱});

#gotop{    display:none;    width:55px;    height:55px;    position:fixed;    right:20px;    bottom:20px;    background:url(/images/backtop.gif) no-repeat 0px 0px;}

您也可以更換自己喜歡的回到頂部圖片。

鏈接放大就是將頁面中的所有鏈接在鼠標移動到其上時字體變大。

[href]:hover{    font-size: 125%;}

代碼很簡單，但是也有問題，如logo圖片也變動了，看著不好看。

解決logo移動問題：

#p-logo{    width:135px; height:135px;}#p-logo a:link,a:visited{    background:url(/mediawiki/skins/common/images/mediawiki_v.png) no-repeat;}

MediaWiki升級可以分兩中方法進行升級，一種是在原有的MediaWiki上進行升級，另一種是搬遷升級。

首先，在升級您的MediaWiki之前先備份好現有的MediaWiki。

雖然升級程序經過良好的測試，也比較可靠，但是仍然是有可能出問題的。所以在運行升級程序之前，請務必做一次完整的備份。其中得包括相關數據庫和相關文件：

• 數據庫里面和 wiki 相關的內容。建議在導出SQL的同時也導出為xml，以策萬全。
  • MySQL:
    • 導出為SQL：mysqldump --all-databases > file.txt
    • 導出為XML：mysqldump --all-databases --xml > file.xml
  • PostgreSQL:
    • 導出為 pg_restore ：pg_dump --create -Fc -i yourwiki > yourwiki.db.dump
• 圖片和其它文件 (在images目錄內)
• 配置文件LocalSettings.php和AdminSettings.php
• MediaWiki 的程序文件，包括所有的皮膚和擴展，特別是你修改和定制過的文件。

上面引用自：

http://www.mediawiki.org/wiki/Manual:Upgrading/zh-hans

想獲取更多關于升級信息，可以點擊上面鏈接地址。

mysqldump -u root -p my_wiki >my_wiki_201403250842.sql

mysql -u root -p my_wiki < my_wiki_201403250842.sql

我的是直接將mediawiki目錄打包，先進入/var/www/目錄，打包mediawiki目錄：

tar zvcf mediawiki.tar.gz mediawiki/

我的MediaWiki原版本是1.20.2，升級到1.22.4，MediaWiki原目錄在/var/www/mediawiki下，直接將新版本的MediaWiki解壓到/var/www/mediawiki/目錄：

sudo tar xvfz mediawiki-1.22.4.tar.gz -C /var/www/mediawiki/ --strip-components=1

加上了--strip-components=1會直接解壓在/var/www/mediawiki/目錄下，如果不加--strip-components=1，會在/var/www/mediawiki/下自動創建一個mediawiki-1.22.4的目錄并解壓在該目錄下。

進入MediaWiki主目錄中的maintenance目錄，運行如下文件：

php update.php

升級后有些插件未必可用，如果您某些插件是您的必須，最好做好調查在升級。

搬遷升級時MediaWiki的版本未必會升級，只是將甲處的MediaWiki搬遷到乙處。

您可能需要對以下目錄或文件進行遷移：

• images目錄搬遷
• skin目錄搬遷
• extensions目錄搬遷（未必可用）
• LocalSettings.php文件搬遷
• 將老MediaWiki的數據庫導入

進入MediaWiki主目錄中的maintenance目錄，運行如下文件：

php update.php

如源碼升級一樣，升級后有些插件未必可用，如果您某些插件是您的必須，最好做好調查在升級。

更多關于我的MediaWiki安裝、設置可以參考下面兩篇博文：

安裝、基本設置：

http://www.CUOXin.com/snowsolf/p/MediaWiki.html

懸浮目錄+隱藏：

http://www.CUOXin.com/snowsolf/p/MediaWiki-catalogue.html