2012-05-10 34 views
2

我改變了bootstrab.js(與懸停剛剛更換點擊):Twitter的引導標籤:展會上懸停,隱藏的onmouseout

$(function() { 
    $('body').on('hover.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) { 
     e.preventDefault() 
     $(this).tab('show') 
    }) 
    }) 

現在我想要的內容標籤關閉,當你不徘徊在標籤或內容。

我該怎麼做?

+0

fyi,由於沒有懸停,因此這對移動觸摸設備不利:o –

+0

在移動瀏覽器上懸停會自動被點擊取代。再加上手動關閉按鈕,它非常流暢。剛剛測試過它... – deekay

回答

2

更新:像下面

var timer; 

$('tab_element').hover(
    function(){ //hover 
     // clear timer first 
     clearTimeout(timer); 
     // then show the content 
    }, 
    function(){ //unhovered, 1000 milliseconds 
     // set a timer to call the hide function 
     timer = setTimeout("hide_function", 1000); 
    } 
); 

$('content_tab_here').bind('mouseleave', function(){ 
    // hide it, you can set a timer here too if you want 
}); 

這裏是計時器http://www.w3schools.com/js/js_timing.asp 的文檔這裏有很多選擇,但是這將讓你開始,我用jQuery是老同學,所以如果你使用的是最新的jquery的版本可以相應地更改代碼。我不想爲你寫出所有的東西,因爲那樣你就不會學習,因爲我在工作,所以沒有那麼多時間。祝你好運。

+0

這是非常容易,工作得很好。謝謝! – deekay

+0

還有一個小問題:在將鼠標懸停在所需的導航標籤後,如果沒有懸停在content-div或另一個導航標籤上,它將保持打開/活動狀態。就像在橫向菜單中一樣,您可以將鼠標懸停在第1個(最左邊)選項卡上,然後向左移動。你的解決方案不會影響它...你需要一個jfiddle來理解我的意思嗎? – deekay

+0

無論是小提琴還是圖片都會有幫助,或者是這個東西嵌套的html代碼。 – Huangism