CSS在溢出區域上方顯示活動元素：隱藏

我有一個帶溢出的滾動窗格div：hidden。請檢查它here。有產品作爲帶有滾動窗格中顯示的標題的圖像。當我將鼠標光標移動到產品div上時，它會變爲淺黃色背景並改變其高度 - 我只是使用jQuery向div添加一個類並且它工作正常。我需要以某種方式解決的問題是，將活動產品的展開div顯示爲滾動窗格上方顯示的單獨div，但現在它出現在該窗格內並將其展開到其高度。我想用與this one類似的方式使它看起來像。在這裏您將鼠標光標移動到產品上，並獲得一個擴展的div來顯示您的詳細信息當然，由於該滾動窗格，我的任務有點困難。CSS在溢出區域上方顯示活動元素：隱藏

來源

2010-08-18 Sergei Basharov

有沒有簡單的方法來做到這一點。考慮到我的頭頂，你可能需要從HTML結構中的原始位置翻譯/克隆整個產品'div'，然後在進行高亮處理之前對其進行AP處理。這可能會很快變得非常難看。 – 2010-08-18 15:35:36

如果在.product的懸停上使用.offset() method，應該不會太困難。您可以執行的操作如下：

在您的.product懸停事件處理程序中，獲取產品的偏移量。這會給你你的產品相對於文件的位置。
接下來創建覆蓋產品信息div並將其直接附加到<body>。
將覆蓋div設置爲絕對位置，並使用偏移調用返回的值來定位它。
最後確保您的疊加層具有比滾動窗格更高的z-index，並且您應該開展業務。

來源

2010-08-18 15:36:27 Pat

CSS在溢出區域上方顯示活動元素：隱藏

回答

相關問題