Search code examples
jquerycssgoogle-chromeflashsoundmanager2

SoundManager2 SWF plugin messes up scrollbar (only in Google Chrome)

Not sure if this is a Google Chrome bug, a SoundManager issue or I am doing something wrong. It only happens in Google Chrome and only when Flash is enabled.

I have a parent <div> with overflow-y: auto.

When SoundManager loads, it creates a new <div> element #sm2-container at the bottom of the page. On $(window).load(), I reposition that element like this:

$("#sm2-container").css({position: "absolute", top: "0px", zIndex: "10"});

However, the scrollbar appears messed up:

Scroll Issue Present

When I disable Flash or "display:none" the #sm2-container, it looks and acts normally, but I have no sound:

Scroll Issue Gone

You can see the issue live here.

Solution

  • This definitely looks like a Chrome bug for me too, because scroll bar is only displayed shifted, in order to scroll I have to aim mouse at where it must be placed.

    A fix: By setting $('#sm2-container').css('z-index','-10'); I can hide it and this fixes scroll bar in Chrome. Sound still plays OK (as I understand, controls for it are in right panel so it is OK for it to be hidden).

    Should something be visible in #sm2-container? It looks empty for me, only by right-clicking it displays Flash menu.