2013-01-07 76 views
6

我最初的搜索表明,出於安全原因,我可能無法做到這一點,但我仍然會問。如何獲得網頁上指定像素的任意的顏色?
更具體地說,這是我自己的網頁,其中包含背景顏色,圖像,CSS修改元素。我需要知道完全渲染的網頁上特定像素的顏色。信息不能來自屏幕抓取,因爲我想修改完整呈現的頁面。如何獲取網頁上任何指定像素的顏色?

哎唷!!! 有人真的「減1」我問真正的問題嗎? 艱難的人羣!

更具體地說: 我想添加一個用戶可移動的畫布元素到網頁上,它可以改變畫布懸停在其上的網頁部分。將畫布元素想象成用戶可以在網頁上移動的放大鏡。但是我希望canvas元素產生的實際效果是一個顏色過濾器(因此需要底層的顏色)。

+0

@Oded:[減1]這是一個奇聞,甚至沒有嘗試的答案... – markE

+4

這就是爲什麼它是一個評論。你的問題需要更加明確。 – Oded

+0

謝謝彼得,我懷疑這個! – markE

回答

1

無法完成w /腳本+技巧。也許通過一個插件

如果你可以設置一個服務器端瀏覽器爲你呈現頁面 - 這可能工作。

+0

嗨斯科特。是的,我需要使用javascript而不是屏幕抓取,因爲我想在閱讀顏色後修改網頁​​ – markE

+0

hey markE - w/o瞭解更多關於您所做的最好的事情我可以提供的是某種服務器端具有像素查找功能的瀏覽器呈現服務.. –

+0

感謝您和彼得。我接受「不能做」作爲正確的答案。 – markE

2

https://chrome.google.com/webstore/detail/eye-dropper/hmdcmlfkchdmnmnmheododdhjedfccka?hl=en

好一些細節這裏....

有了Chrome插件,你可以加載你的頁面,並使用小滴管工具來選擇您所在頁面的段有興趣找出顏色。這很簡單,但是對於你的「編輯」類型的屏幕截圖。不知道您是否可以使用chrome。

如果您不能使用插件,您是否有能力通過右鍵點擊選擇html元素?

+1

這是Chrome的擴展。不是一個真正的答案。 – Peter

+1

你在說什麼,不是真正的答案... – amarkson

+0

這不是一個真正的答案,告訴我如何使用你的解決方案在Firefox上我會給你+1 – Peter

2

當DOM更新時,您可以使用html2canvas庫將網頁重新渲染到畫布,然後從畫布中獲取像素信息。

但是,這聽起來像你想要實現可能與CSS濾波器。 Here's a demo of what css filters can do. 您需要使用相同的HTML呈現兩個圖層,其中頂層應用了過濾器,並將其裁剪爲僅覆蓋所需區域。

+0

html2canvas對我很好!現在試圖讓這個工作在一個Firefox插件...和它的失敗默默,任何想法?我使用的是firefox jpm-sdk – Nick

相關問題