懸停在slideToggle（2 divs）

我正面臨與我的JavaScript/jQuery的問題。懸停在slideToggle（2 divs）

我在屏幕的底部有一個div，當我將鼠標懸停在它上面時，我想要一個div上來，當我用鼠標在它上面時，它就停留在那裏。當我離開盒子時，它應該再次崩潰。我的html：

<div id="footer"> 
      <div id="howitworksBtn"> 
       How it works 
      </div> 

      <div id="howitworksContent"> 
       Second box 
      </div> 
     </div>

而我的Javascript，它還沒有工作，所以請幫助！

$("#howitworksBtn").hover(function() { 
    $(this).parent().find("#howitworksContent").stop().slideToggle("slow"); 
    });

編輯：

我的CSS：

#howitworksBtn { 
    width: 220px; 
    height: 20px; 
    margin: auto; 
    text-align: center; 
    background-color: gray; 
    -moz-border-radius: 15px 15px 0 0; 
    border-radius: 15px 15px 0 0; 
} 

#howitworksContent { 
    margin: 0; 
    display: none; 
    background-color: gray; 
    color: white; 
    text-align: center; 
    font-size: 3em; 
    font-family: helvetica; 
} 

#footer { 
    width: 100%; 
    position: absolute; 
    bottom: 0; 
}

來源

2013-10-25 Haidy

你是什麼意思的「NOt Working」..？你是否在控制檯中收到任何錯誤消息？ – writeToBhuwan

不，我只是不明白它的工作;） – Haidy

它在[jsfiddle]（http://jsfiddle.net/CTQ2q/）上正常工作。 –

這是令人驚訝的非常簡單。。:)

$("#howitworksBtn").parent().hover(function() { 
     $(this).find("#howitworksContent").slideToggle("slow"); 
});

來源

2013-10-25 20:05:40 writeToBhuwan

這很容易是的。該死的感謝隊友！ ;） – Haidy

懸停花費2個用作參數：

.hover() jQuery API documentation

$("#howitworksBtn").hover(
    function() { 
     $(this).parent().find("#howitworksContent").stop().slideToggle("slow"); 
    }, 
    function() { 
     $(this).parent().find("#howitworksContent").stop().slideToggle("slow"); 
    } 
);

來源

2013-10-25 20:04:49 spojam

不要保持開放，如果你在第二個盒子 – Haidy

懸停在slideToggle（2 divs）

回答

相關問題