菜單下拉懸停與滑塊鏈接衝突

-4

我們似乎在我們的網站主頁上發生衝突，如果光標進入鏈接佔用的區域，則位於下拉菜單下方的鏈接會導致它過早關閉菜單。菜單下拉懸停與滑塊鏈接衝突

任何想法可能導致這種情況？

主頁是http://www.weddingideasmag.com，我試圖測試的鏈接在主獎項標籤下稱爲2014獎。

這絕對是一個滑塊鏈接問題，因爲問題只發生在滑塊鏈接所在的主頁上。我附上了下面問題區域的屏幕截圖。

enter image description here

這是同一地區在Chrome開發者工具高亮顯示。我認爲這可能是一個z索引問題，但即使我將下拉ul z-index更改爲大於鏈接區域，問題仍然存在。

enter image description here

的下拉菜單中的CSS是...

position: absolute; 
top: auto; 
display: none; 
float: left; 
zoom: 1; 
z-index: 10; 
margin: 0 0 40px -1px; 
padding: 20px 0 6px; 
-webkit-box-shadow: 0 3px 5px 0 #999; 
-moz-box-shadow: 0 3px 5px 0 #999; 
box-shadow: 0 3px 5px 0 #999; 
border: 1px solid #CCC; 
background: #fafafa; 
color: #676767;

而且滑塊li元素的CSS是...

position: absolute; 
top: 0; 
right: 0; 
height: 100%; 
width: 5%;

來源

2014-10-30 Ben Iskander

請在此添加有意義的代碼和問題描述。不要只是鏈接到需要修復的網站 - 否則，一旦問題解決，這個問題將會給未來的訪問者帶來任何價值。發佈一個證明你的問題的[簡短的，自包含的，正確的例子（SSCCE）]（http://www.sscce.org/）將幫助你得到更好的答案。有關更多信息，請參見[我網站上的某些內容不起作用。我可以只粘貼一個鏈接嗎？]（http://meta.stackexchange.com/questions/125997/）謝謝！ – Cerbrus 2014-10-30 11:10:15

我不確定要添加什麼有意義的代碼，因爲我不確定問題是什麼 - 如果我確實有線索，我會包括一些。至於問題描述，我的文章中沒有包含哪些內容？ – 2014-10-30 11:23:56

設置a.flex-next的z-index到9，而不是的隨機數爲99，其大於下拉（z-index: 10）的z-index。似乎工作，但你的風格通常相當混亂。

來源

2014-10-30 11:38:48 fzzle

非常感謝@frif非常感謝。他們以什麼方式混亂？它們大多數都是默認的Woothemes樣式表:-( – 2014-10-30 11:49:58

不客氣，Stylesheets在DevTools中總是顯得雜亂無章，您應該從一開始就發佈相關樣式，可能也是爲什麼您會有這麼多的downvotes – fzzle 2014-10-30 11:59:36

-1

嘗試指針事件：您的鏈接上沒有任何與您的菜單打開

來源

2014-10-30 11:45:06

這將是他的問題是'a.flex-next'元素在下拉列表前面。 – fzzle 2014-10-30 11:48:43

Hi @Jeff - thansk對於這個建議我試過了，它使得下拉框在鼠標滾動時消失 - 而不是想要的效果;-) – 2014-10-30 11:49:37

它可以做......用一點點的js，當你的下拉是可見的時候在你的flex-next鏈接上一個類 – 2014-10-30 12:01:15

菜單下拉懸停與滑塊鏈接衝突

回答

相關問題