MozTW 討論區

各項 Mozilla 相關軟體與技術討論
現在的時間是 2024-04-18, 17:35

所有顯示的時間為 UTC + 8 小時





發表新文章 回覆主題  [ 10 篇文章 ] 
發表人 內容
文章發表於 : 2006-05-24, 16:18 
離線
頭像

註冊時間: 2005-04-02, 21:10
文章: 240
曾觀看線上漫畫的朋友應有類似經驗,本來只是想看漫畫,卻整個網頁塞滿了廣告,而且因為廣告太多,造成漫畫超過一頁而必須用滑鼠拉來拉去,要看下一頁,還得在廣告堆裡找下一頁連結。

個人認為:

1. 既然是看漫畫,最好只秀出漫畫圖片,其它都清乾淨。

2. 因為載入一幅圖需要點時間,最好在看第一頁時,第二頁能預先在背地裡載入,等我看完這頁,下一頁也下載完畢,這樣完全不用等待。

3. 再者,用滑鼠找到下頁連結再點下去實在太慢,為什麼不可以隨處按一下滑鼠或鍵盤就自動換頁呢?


抱著獨樂樂不若眾樂樂的想法,在此野人獻曝。

a. 針對第一項需求,我用的是Stylish套件,它可以清掉絕大部份我不想見到的內容。

b. 要達到2和3的需求,我使用Greasemonkey。操作方法是載入畫面後,點一次滑鼠(或按一次空白鍵)就在新頁籤載入下一頁;再點一次滑鼠表示關閉本頁,下一頁自然跑到前景,如此可以有翻頁的效果。

c. 另外,我使用Tab Mix Plus來達到在背景開新頁籤載入連結的效果。

也許你會問,既然都用上Greasemonkey了,那Stylish可做的事應可完全用Greasemonkey做掉,如此不更省事。的確如此,但實測發現,Greasemonkey是整個頁面載入完成並且秀出內容後才開始動作,因此畫面會先顯示再消失,有閃動的感覺。若用Stylish,內容直接被隱藏,不會秀出來,效果較佳。


以這個站為例:http://www.yixia.net/pic/445/1_2.html,畫面如下:
http://forum.moztw.org/files/y1_200.gif

原始畫面充滿廣告,連漫畫本身也被遮住了。經過Stylish修飾後只剩下圖片:
http://forum.moztw.org/files/y2_164.gif

上圖左方中間有個紅色小方框,內容顯示Next,這是我用Greasemonkey所做的,提示點一下滑鼠會在背景頁籤打開下一頁。

按下滑鼠後,在目前頁籤右側會出現新頁籤且正在載入下一頁,而剛才的提示方框內的文字變成Close,表示再按一下,目前這頁會被關閉。
http://forum.moztw.org/files/y3_768.gif

再按下滑鼠,剛才的畫面被關閉了,取而代之的是原本在背景的頁籤,而這個畫面的提示方框顯示Next,操作狀態又回到前面所說,依此類推。

這麼一來,只要不斷地點一下滑鼠或按一下鍵盤,就可以連續翻頁,可以一口氣看下去,豈不樂哉。Firefox和套件所展現出的強悍莫過於此啊!

以下是我的greasemonkey script:
代碼:
// ==UserScript==
// @namespace
// @name          Yixia
// @description   Click to open next page, click again to close current page
// @include       http://www.yixia.net/*
// @exclude
// ==/UserScript==

// add a note
var clickNote=document.createElement('div');
clickNote.setAttribute('style', '-moz-opacity: 0.5; position:absolute; z-index:99; top:300px; left:1px; font-family:Tahoma; font-size:9px; background-color:#f00; color:#fff; margin:0; padding:0 1px 0 1px;');
clickNote.innerHTML='Next';
clickNote.id='clickNote';
document.body.appendChild(clickNote);

// open next page or close current page
var doOnEvent = 'if(document.getElementById("clickNote").innerHTML=="Close"){ window.close(); }else{ document.getElementById("clickNote").innerHTML="Close"; window.open("' + (document.getElementById('hl_next')? document.getElementById('hl_next').href : document.getElementById('oHTML').getElementsByTagName('a')[1].href) + '"); }'
document.body.setAttribute('onclick', doOnEvent);
document.body.setAttribute('onkeyup', 'if(event.which==27 || event.which==32){'+doOnEvent+'}');


還有Stylish style:
代碼:
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url-prefix(http://www.yixia.net/pic/) {

  /* hide elements */
  iframe,
  .fontborderbig,
  #whole[bgcolor="#eeeeee"],
  #Table1 tr[height="35"],
  #Title1_pl_title,
  #Table1[width="200"],
  #pl_info hr,
  #pl_info p,
  #pl_info br,
  #pl_info + p,
  a img
  {display:none !important;}

  /* set size of wrapper */
  table#whole[height="100%"]
  { height: 800px !important; }

  /* set img size */
  img { width:670px !important; }
}


附加檔案:
檔案註釋: 在背景載入下一頁
y3.gif [38.79 KiB]
被下載 357 次
檔案註釋: Stylish修飾後的畫面
y2.gif [81.84 KiB]
被下載 364 次
檔案註釋: 充滿廣告的頁面
y1.gif [68.45 KiB]
被下載 355 次

_________________
圖檔


最後由 arphen 於 2006-05-24, 18:00 編輯,總共編輯了 2 次。
回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.3) Gecko/20060426 Firefox/1.5.0.3
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2006-05-24, 17:47 
離線
頭像

註冊時間: 2005-01-05, 21:54
文章: 182
太棒了,像這種實用性的推廣文章的確能吸引有特定需要的族群使用Fx!

Good job!


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.3) Gecko/20060426 Firefox/1.5.0.3
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2006-05-24, 18:26 
離線
頭像

註冊時間: 2005-01-16, 12:43
文章: 46
:D
太厲害了~
感謝分享這麼好的技巧,這一定要推的啊!
不過小弟以為要使用stylish之類的套件,還是要有相當的html css基礎吧 :P


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.2) Gecko/20060308 Firefox/1.5.0.2
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2006-05-24, 19:10 
離線

註冊時間: 2003-11-18, 10:59
文章: 3473
真是有創意的作法!很讚!!

_________________
:::: 簽名檔分隔線 ::::
免費好用又自由的輸入法 gcin Windows | 勸大家以後不要再買 ATI


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.3) Gecko/20060426 Firefox/1.5.0.3
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2006-05-25, 09:13 
離線
頭像

註冊時間: 2005-04-02, 21:10
文章: 240
nio127 寫:
:D
不過小弟以為要使用stylish之類的套件,還是要有相當的html css基礎吧 :P


目前為止,用Greasemonkey要懂Javascript、用Stylish要懂CSS是無法避免的事,雖然有些套件試著讓不懂程式的使用者可以透過友善界面自訂畫面,但對於細部的流程控制還是得用程式手段才能達成。

我認為這部份可說是Firefox被封印的一股強大力量,因為沒有適當管道及方法,所以無法完全展現它的威力及影響。

或許論壇可以開辦個網頁客製化專區,媒合一般使用者和懂設計的使用者,交互激盪的成果,應該很值得期待。

以上純屬個人淺見。

_________________
圖檔


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.3) Gecko/20060426 Firefox/1.5.0.3
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2006-05-25, 09:40 
離線
頭像

註冊時間: 2004-07-23, 14:05
文章: 1552
來自: 台北縣豆腐的故鄉
arphen 寫:
我認為這部份可說是Firefox被封印的一股強大力量,因為沒有適當管道及方法,所以無法完全展現它的威力及影響。

或許論壇可以開辦個網頁客製化專區,媒合一般使用者和懂設計的使用者,交互激盪的成果,應該很值得期待。

以上純屬個人淺見。
值得推動的方向! :D 推動大家實際動手玩,更能釋放Firefox的能量:)

_________________
不努力的話,就會死在這裡,或是死在那裡。


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.3) Gecko/20060426 Firefox/1.5.0.3
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2006-05-25, 10:40 
離線
頭像

註冊時間: 2004-08-27, 21:52
文章: 1939
我是用Link Toolbar
會在下排工具列角落跑出 << < ^ > >>等按鈕
然後只要圖片的數字有一定的規律
就一直把游標停在 > 慢慢按嘍

可以滿足
1除了漫畫圖片本身不用看到任何東西
2不用找上下頁的連結點(或許還可以用熱鍵?沒特別研究)

但是預先載入這點倒是沒有(對於看漫畫的人相信這很重要吧)
還有不支援1.5 (所以要改用Next! Please)

總之arphen君提供的似乎是個不錯的技巧

_________________
被恐嚇嘍…真恐怖…暫時不放簽名檔了 :)


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.1) Gecko/20060111 Firefox/1.5.0.1
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2006-05-25, 10:47 
離線
頭像

註冊時間: 2004-08-27, 21:52
文章: 1939
arphen 寫:
nio127 寫:
我認為這部份可說是Firefox被封印的一股強大力量,因為沒有適當管道及方法,所以無法完全展現它的威力及影響。

或許論壇可以開辦個網頁客製化專區,媒合一般使用者和懂設計的使用者,交互激盪的成果,應該很值得期待。

以上純屬個人淺見。

沒錯啊啊
客製化啊啊啊

雖然看功能好像很誘人
但是馬上會讓我感覺"好像很難/麻煩,還是多按幾下滑鼠好了"

小遺憾一點

_________________
被恐嚇嘍…真恐怖…暫時不放簽名檔了 :)


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.1) Gecko/20060111 Firefox/1.5.0.1
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2006-05-25, 10:50 
離線

註冊時間: 2003-12-10, 18:28
文章: 25
就是該這樣玩才對嘛~~~~


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.1) Gecko/20060215 Firefox/1.5.0.1
 個人資料  
引用回覆  
 文章主題 :
文章發表於 : 2006-05-25, 23:20 
離線
[網站管理員]

註冊時間: 2005-01-02, 05:49
文章: 3220
nio127 寫:
:D
太厲害了~
感謝分享這麼好的技巧,這一定要推的啊!
不過小弟以為要使用stylish之類的套件,還是要有相當的html css基礎吧 :P

是的沒錯,要寫的確是要懂專門技術,
不過只是想要用的話,會複製貼上就行了。
(當然你要先會開啟相關的編輯視窗)

另外碰上這類很規律的上下一頁的網頁,
我個人很懶,所以是用 repagination 這個擴充套件來處理。
(搜尋一下本討論區可以找到相關介紹)

至於廣告……因為我用 NoScript 擋掉 JavaScript ,
所以根本沒看到………

_________________
【Firefox 有問題請先看這裡】
回覆文章的建議
萬用自我檢測除錯大法 for Firefox
完全備份大法 for Firefox
重建 Firefox 的設定
乾淨升級 Firefox
(本帳號停用中)


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; zh-TW; rv:1.8.0.3) Gecko/20060426 Firefox/1.5.0.3
 個人資料  
引用回覆  
顯示文章 :  排序  
發表新文章 回覆主題  [ 10 篇文章 ] 

所有顯示的時間為 UTC + 8 小時


誰在線上

正在瀏覽這個版面的使用者:沒有註冊會員 和 5 位訪客


不能 在這個版面發表主題
不能 在這個版面回覆主題
不能 在這個版面編輯您的文章
不能 在這個版面刪除您的文章
不能 在這個版面上傳附加檔案

搜尋:
前往 :  
Powered by phpBB® Forum Software © phpBB Group
正體中文語系由 竹貓星球 維護製作
© moztw.org, Mozilla Foundation
MozTW,Mozilla 台灣社群