限制：懸停父元素

Question

來到這裏，我的例子（在網上找了一些漂亮的照片給你）：http://jsfiddle.net/xGPys/（僅適用於Chrome的工作，如果有人發現爲什麼Firefox不喜歡它）

所以這使我麻煩的部分有：

.imagepreview:hover a { 
    top: -61px; 
    height: 150px; 
    z-index: 1000; 
} 

我想實現的是：你應該能夠通過你的鼠標整列，並且每個圖像應該打開，另一個關閉後一個，右現在，已打開的照片覆蓋其他照片，因此:hover狀態將從01中刪除。

我可以使用一點Javascript，但我更喜歡保持純CSS。

謝謝！

Answer 1

只需設置pointer-events到none：

.imagepreview a { 
    /* ... other styles ... */ 
    pointer-events: none; 
} 
.imagepreview:hover a { 
    top: -61px; 
    height: 150px; 
    z-index: 1000; 
} 

這是你的提琴：http://jsfiddle.net/xGPys/1/

---

警告：pointer-events是實驗。自行決定使用。