你如何製作一個'粘性'線索，點擊打開，關閉點擊本身之外的點擊？

我有一個設置爲sticky的線索，當點擊一個鏈接時打開。我還設置了一個關於cluetip的關閉按鈕，所有這些都很好。如果有人在當前關閉按鈕之外點擊了線索之外，我想關閉提示。我正在尋找懸停解決方案，只需點擊線索外的點擊即可。你如何製作一個'粘性'線索，點擊打開，關閉點擊本身之外的點擊？

來源

2011-04-12 momos

按照常見問題，有一個API的方法，讓你觸發關閉：

作爲新的clueTip 1.0.3：如何編程關閉（隱藏）一clueTip？如果要觸發clueTip收的基礎上，其他一些互動，您可以使用下面的代碼： $(document).trigger('hideCluetip');

所以我認爲你可以做這樣的事情：


$('#myCluetip').cluetip({ 
    onShow: function() { 
    $(document).one('mousedown',function() { 
     $(document).trigger('hideCluetip'); 
    }) 
    }); 
});

這是通過將mousedown事件的一次性事件處理程序綁定到文檔主體，然後觸發Cluetip人員說的事件將隱藏打開的Cluetips。使用一次性事件處理程序意味着每次有人點擊某件事物時，都不會發送hideCluetip觸發器。

來源

2011-04-12 21:33:37 Richard

我最終採取使用hideClueTip但綁定的這一概念，並解開了取決於點擊是否在提示中（我決定在點擊提示外點擊時關閉提示），通過onShow和onHide掛鉤捕獲鼠標事件。 – momos 2011-04-15 04:10:45

@mornos好主意！ – Richard 2011-04-15 05:17:29

@mornos - 你可以發佈你的解決方案嗎？ – leora 2011-10-06 02:07:05

這將有助於看到你的代碼，但無論如何，你可以沿着這些線做些事情;

$(document).click(function(e) { 
    if (!$(e.target).hasClass('cluetip')) 
    { 
     // Close the cluetip here. 
    } 
});

來源

2011-04-12 20:59:32

Stony的解決方案並不適合我。

我使用@Gary Green的解決方案，它工作正常 - 但這仍然不是我想要的確切的「關閉mouseout/hoverout」解決方案。

最後，我發現Cluetip本身提供了一種方法來做到這一點。

只需設置值「mouseOutClose：假」，像這樣：

$("#myForm :input").cluetip(
    { 
     sticky: true, 
     closePosition: 'title', 
     arrows: true, 
     mouseOutClose: true 
    } 
);

來源

2011-05-06 06:43:18

只需添加，您需要爲mouseOutClose添加粘性選項才能工作。 – Purus 2013-10-17 17:09:51

我是這樣做的：

onShow: function() { 
     // close cluetip when users click outside of it 
     $(document).click(function(e) { 
      var isInClueTip = $(e.target).closest('#cluetip'); 
      if (isInClueTip.length === 0) { 
       $('.cluetip-default').hide(); 
      } 
     }) 
    },

來源

2011-10-19 17:49:08

+1。作品完美。 – Purus 2013-10-17 17:45:06

你如何製作一個'粘性'線索，點擊打開，關閉點擊本身之外的點擊？

回答

相關問題