Cross-tab popups flickering

[SteveMarvin]

In the cross-tab browser https://www.cfregisters.org/en/app?q=app, the pop-up windows over the receipt numbers do not work well, flickering in an unreadable way. It's difficult to see, but the cursor alternates between the arrow and question mark, and you can just see the outline of the popup flickering underneath.

This is on an older Mac mini with the latest OS updates, using Chrome (Version 68.0.3440.106 (Official Build) (64-bit)). Verified also on MacBook Pro 2017 with latest OS and Chrome.

[SteveMarvin]

circa1977 had a useful reply to this when I posted it to the wrong board:

@jamiefolsom I was able to reproduce this once, only on the Project History nav. The mouseout didn't seem to fire, potential due to a stack order issue with the embedded "app." I wasn't able to reproduce it again, and the JS for the nav elements is pretty cut and dry:

$(document).ready(function() {
    $('.primary > div').on('mouseenter', function(e) {
        e.preventDefault();

        $(this).children('div').stop().animate( { height: ["toggle", "swing"] }, 250 );
    })

    $('.primary > div').on('mouseleave', function(e) {
        e.preventDefault();

        $(this).children('div').stop().animate( { height: ["toggle", "swing"] }, 250 );
    })

The primary nav links have a z-index of 8; the dropdowns have a z-index of 9.

Unless this can be reproduced on another page of the site, as it's a conventional, straightforward approach, this should be addressed in the embedded "app." I would recommend moving this to that project.

Thanks!