A bit of a mystery. I have a static page (CMS Page in Magento-parlor) that includes bootstrap-tooltip and bootstrap-popover. They seem to load/work fine since I can see a popover trigger once... But that's the problem, the event occurs only once.

In a debugging attempt, I added a :hover pseudo class to the page's css, which changes background color. This also triggers only once when the popover() is initialized on the element.

The website is a static page in Magento 1.7.2. Please hover over the circle above the note "Open-source hardware" to see the problem.

Thanks!

有帮助吗?

解决方案

I'm unfamiliar with the specific mechanics of Bootstrap (kids, my lawn, get off), but looking at this from a pure javascript/dom point of view it appears your hover is over the following div

<div id="hardware-overlay" class="img-circle" data-placement="top" data-content="The arduino-compatible hardware connects
    five environmental sensors to the internet Wirelessly." data-original-title="" title="" style="">
</div>

When you roll-off/mouseout of of the popover, the above div's DOM node is changed to include a style="display:none;"

<div id="hardware-overlay" class="img-circle" data-placement="top" data-content="The arduino-compatible hardware connects
    five environmental sensors to the internet Wirelessly." data-original-title="" title="" style="display: none; ">
    </div>

Because this div is not being displayed, there's nothing to trigger the pop over. If I run the following javascript from Chrome's debugger console

jQuery('#hardware-overlay').css('display','block')

I can get the rollover to run again (with the same "only runs once" behavior)

Hope that helps narrow down the problem.

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top