[ plurk css ] 隱藏朋友粉絲區的圖示 @ 金羽銀華

最近又有噗友問到如何隱藏朋友粉絲圖的問題，因為噗浪預設會出現好友與粉絲的資料與代表圖，

如果希望提高隱私的設定，隱藏這部份的資料，目前只能靠自訂CSS來幫忙囉～

原本登入後的朋友粉絲區長這樣：

0原本.png

我們可以用CSS把朋友粉絲圖示隱藏起來：

1隱藏照片.png

語法：

/*-------------------------------/ 1 / --------------------------*/
/*隱藏朋友粉絲圖***/
div#dash-friends-pics, div#dash-fans-pics
{
   height:0px;
   overflow:hidden;
   zoom:1;
}

包括標題也可一起隱藏：

2標題也隱藏.png

語法：

/*-------------------------------/ 2 / --------------------------*/
/*隱藏朋友粉絲圖和標題***/
div#dash-friends-pics, div#dash-fans-pics, /*圖*/
#dash-fans h2, #dash-friends h2 /*標題*/
{
   filter:alpha(opacity=0) !important;opacity: 0 !important;zoom:1;
   height:0px;
   overflow:hidden;
}

這樣個人的公開頁面僅會顯示加入與追蹤等按鈕，其它圖示與文字均隱藏了：

3還留有加入按鈕.png

如果希望連加入與追蹤按鈕都隱藏，也可以用CSS做到：

4連加入鍵也隱藏.png

語法：

/*-------------------------------/ 3 / --------------------------*/
/*完全隱藏朋友粉絲區***/
#dash-friends, #dash-fans
{
   filter:alpha(opacity=0) !important;
   -moz-opacity:0 !important;
   opacity: 0 !important;
   height:0 !important;
   width:0 !important;
   overflow:hidden;
   zoom:1;
}

這樣公開頁面僅會顯示個人簡介與統計資料：

5公開頁剩發私噗鍵.png

若只想稍微來點變化，或僅是不希望過多代表圖影響畫面佈景整體，也可以選擇先隱藏圖片、待滑鼠移過去再顯現的方式：

先隱藏：

6隱藏圖.png

滑鼠移過去顯現：

7移過去顯示.png

語法：

/*-------------------------------/ 4 / --------------------------*/
/*朋友粉絲圖透明度變化***/
.user_link img
{
filter:alpha(opacity=0) !important; opacity:0 !important; zoom:1;
}
.user_link img:hover
{
filter:alpha(opacity=100) !important; opacity:1 !important; zoom:1;
}

另外，也可以將朋友粉絲區塊下方的邀請與尋找朋友等功能都隱藏起來，讓畫面更乾淨：

8隱藏下方各功能圖示.png

語法：

/*-------------------------------/ 5 / --------------------------*/
/*隱藏朋友搜尋,入門說明,邀請朋友,分享連結,社交小圖示***/
#dash-friends p, #dash-friends form,
div #tw_help,
div a#dashboard-invite,
div #sharePlurk,
.dash-icon
{
   filter:alpha(opacity=0) !important;
   -moz-opacity:0 !important;
   opacity:0 !important;
   height:0 !important;
   width:0 !important;
   overflow:hidden;
   zoom:1;
}