通過背景表格瀏覽網站背景

Question

這很難解釋，但我會嘗試。我在CSS中有一個背景圖像，然後我在它的頂部有一個表，它有一個白色的背景。所以你不能在CSS中看到背景。

但我想要的效果是能夠將鼠標懸停在圓形圖像或形狀上，然後在該小區域中顯示背景。

一種可視化的方法，我在桌子上有一張照片，我在圖像上放了一張紙，因此沒有圖像可見。我現在在紙上劃了一個洞，然後我可以通過那個洞看到照片。另外，當我看着不同的部分時，我將紙張圍繞變化背後的圖像移動。

這裏使用這裏http://www.thebestdesigns.com/2012/05/18/andy-chak/與字母去背景。

任何想法都會很棒，但如果這是不可能的，我會堅持。

Answer 1

而不是把背景顏色整體上表格可以將背景顏色放在單獨的表格單元上。

td, th { background:#fff; } 

然後，當你將鼠標懸停在一個表格單元格：

td:hover, th:hover { background:none; } 

或者，如果你想顯示更大的區域，你可以添加一個類到小區的集羣，然後做同樣如上關閉它們都具有特定的類細胞的羣集上的背景：

td.my-class-name:hover, th.my-class-name:hover { background:none; } 

顯然，這不是圓形形狀，而是可能的解決方案反正。

Answer 2

懸停時，您可以將其中一個表格單元的背景顏色設置爲transparent。雖然，得到這個工作，你應該有你的白色背景設置td，不table，如下所示：

td { 
    background-color:white; 
} 

td:hover { 
    background-color: transparent; 
} 

的jsfiddle
http://jsfiddle.net/a2jp5/1/