I seem to be having an issue that is strictly happening in Safari (5.1 (7534.50)) on Windows XP. I googled a bunch of different things but can’t seem to find someone with the same issues so I made a JSFiddle & documenting what I’m experiencing here.
The goal is to have a div that is the “display area” & a list of divs below it that will hide all div’s in the “display div” on click & then fade in the appropriate div associated with the clicked thumbnail.
When clicking one the first item below the display area followed by the second, you will see that the previous video code does not get hidden & the previous video gets anchored to the top of the page.
Every browser I’ve tested this with aside from Safari on Windows XP displays the intended behavior. It is specific to iframe and/or object embedded video code as I have the same type of jQuery managing an image gallery in a similar fashion.
If you have any ideas or want to fork the JSFiddle & take a stab at fixing this, please be my guest & let me know what you come up with. The only solution I found was to have the page refresh & then check the new hash value & load the appropriate div with video.