selectivizr icon indicating copy to clipboard operation
selectivizr copied to clipboard

Hover is disabled for inserted elements

Open kylemacfarlane opened this issue 12 years ago • 3 comments

Hover doesn't work on elements inserted after Selectivizr has run. Deleting the whole hover case fixed the issue for my circumstances but is obviously not the proper solution.

You can repeat the issue by using IE9 in IE7/8 modes and the following files. "Boo!" will only appear in the original element when Selectivizr is included.

EDIT: A hosted example http://dl.dropbox.com/u/17827955/selectivizr-gh32/index.html

style.css:

span {
    visibility: hidden;
}

div:hover span {
    visibility: visible;
}

index.html:

<!doctype html>
<html>
<head>
    <link href="style.css" media="screen, projection" rel="stylesheet" type="text/css" />
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <!-- I could only find a hosted version of 1.0.2, but 1.0.3b has the same problem -->
    <script src="//cdnjs.cloudflare.com/ajax/libs/selectivizr/1.0.2/selectivizr-min.js"></script>
</head>
<body>
    <div>Hello <span>Boo!</span></div>
    <a href="#">Add element</a>

    <script>
    $('a').click(function() {
        $('<div>Hello <span>Boo!</span></div>').insertBefore($(this));
    });
    </script>
</body>
</html>

kylemacfarlane avatar Mar 09 '12 11:03 kylemacfarlane

I'm also experiencing the same issue involving :hover for elements that are dynamically added to the DOM after the page has already loaded. I'm using IE 8 and jQuery 1.5.2 (although not officially supported yet by Selectivzr, in this instance I'm not using jQuery with pseudo-selectors)

skapadia avatar Mar 14 '12 13:03 skapadia

I'm having this issue too... Still, after two years.

Another example:

.container a:hover { ... } /* works fine */
.container a:before { ... } /* works fine */
.container a:before:hover { ... } /* doesn't work */

Please note that disabling selectivzr makes hover on pseudo-elements work again.

One more example:

.container a:first-child { ... } /* works fine */
.container a:before { ... } /* works fine */
.container a:first-child:before { ... } /* doesn't work */

This really needs fixing, now that IE8 is still around.

thany avatar Jan 31 '14 11:01 thany

Confirmed. @thany, it's still around after 2 years because that's the last time it saw new commits.

Is there any maintainer still alive?

zamber avatar Jul 14 '14 10:07 zamber