私はJQuery Hoverintentプラグインの使用に取り組んでおり、いくつかの良い進歩を遂げましたが、.hide、.slideUpなどを out: 関数で使用して、hoverintentがロールインするオーバーレイが確実に表示されないようにする問題もあります。ホバーアウトするとすぐに消えるだけではありません。現在、私はその理由を理解することができませんでした.オーバーレイをすぐに非表示にするだけで、何の効果もありません.
JQuery:
$(function satisfactionGaugeHoverIntent() {
satisfactionConfig = {
sensitivity: 3, // number = sensitivity threshold (must be 1 or higher)
interval: 200, // number = milliseconds for onMouseOver polling interval
timeout: 0, // number = milliseconds delay before onMouseOut
over: function () {
$('#satisfactionOverlay').show("drop", { direction: "up" }, 1000);
},
// function = onMouseOver callback (REQUIRED)
out: function () {
$('#satisfactionOverlay').slideup('slow', 500);
} // function = onMouseOut callback (REQUIRED)
}
$('#satisfactionChartButton').hoverIntent(satisfactionConfig);
});
HTML:
<div id="satisfactionChartButton" class="large-3 large-offset-1 columns modalGaugeArea allGaugesSetup">
<div class="chartModalTitle">Customer Satisfaction</div>
<div id="customerSatisfactionGauge" class="gaugeContainer"></div>
<input id="customerSatisfactionGaugeValue" type="hidden" data-url="@Url.Action(MVC.ATSNavigator.SatisfactionTotalAverageData())" />
<div class="chartModalDialog">rating out of 5</div>
<div id="satisfactionOverlay">
<div class="overlayChartTitle">
Customer Satisfaction<br />
Chart
</div>
<img class="overlayImages" src="@Url.Content(Links.Content.img.wht_Desktop_Analytics_png)" />
<div class="overlayChartDialog">Click to View Chart</div>
</div>
</div>
over: 関数はうまく機能しますが、問題は out です。この機能が機能していないように見える理由はありますか?