Misha's Blog

I am helping a friend out with a website. He wants to have a wordpress theme with a media content slider and he wants it to work on smart phones. I found that the two best sliders that handled images and video (AnythingSlider and WP_Slider Theme) had a bug when viewed on my Android HTC Incredible (Android 2.2, WebKit 3.1 Browser). I found that the bug is on the Android browser side, and created this quick and dirty patch of WP_Slider Theme to work on Android.

There seems to be a bug in Android phone browsers relating to overflow:hidden CSS property. The overflow property, when set to hidden on a div causes any elements that spill out of that div’s bounding box to be clipped and not shown. It seems that on my phone’s browser this breaks for videos. Youtube embeds, for example, float on top of everything even when they are supposed to be hidden.

Using jQuery and CSS selectors I found all the elements that are supposed to be hidden and set their visibility to hidden as well, which really hid them even on my phone. Here is the diff to WP_Slider Theme (generated with git) that shows my changes. I’m also including another patch which hides redundant commenting links in the theme. More specifically, the theme doesn’t differentiate between a first-time reply (first comment ever) link and a link to previously made comments. Other than that it is a fine theme, though if I end up using it I would tone down the graphics quite a bit.