The only problem arises when YouTube videos are embedded in the slider. For the purposes of this article I am using a bit of text with a video embed floated right inside the slider list items, to achieve the layout shown below.
Aside from the content of the slider, the only change I have made to the EasySlider demo is to set auto to false.
In almost every major browser there is a showstopper of a problem: in Firefox and Opera 10 the videos are not hidden and can be seen to the left and the right of the slider, in IE8 the control buttons disappear, in IE6 & IE7 the text is missing and the video appears to be floated left, in Safari 4 for Windows the videos have a streaky rather than a sliding transition, and in Chrome there is a slight flicker when the videos are sliding.
You can see this happening at http://www.websiteni.com/tbps/easyslider/01.html.
The fix is dead simple. Instead of using the default YouTube embed code, change it to valid HTML and set wmode to transparent like so.
<object style="float:right;width:250px;height:250px" type="application/x-shockwave-flash" data="http://www.youtube.com/v/FSFYSzbDEKE&hl=en&fs=1&rel=0"> <param name="movie" value="http://www.youtube.com/v/FSFYSzbDEKE&hl=en&fs=1&rel=0"> <param name="wmode" value="transparent"></object> <!--scuse the inline styles-->
And that’s all there is to it. You can see it working perfectly using this method at http://www.websiteni.com/tbps/easyslider/02.html.