JW Player videos don't resize down for mobile devices

[sutisameechan 0]

JW Player plugin is my preferred plugin for self-hosted video. The problem I'm having is that the videos won't resize with the browser window. As a result, mobile users see a horizontal scroll bar, and can't view the video without zooming out. Does anyone have a better solution for embedding video that will automatically resize based on the user's device or size of the viewport?

[beardedavenger 158]

Hey There, OK so what we need to do is wrap those embedded videos in a DIV. This will work for embed, and object. Now, there's a super easy way and that's with [url="http://www.pagelines.com/store/plugins/ba-shortcodes/"]Bad Ass Shortcodes[/url]. Of course I'm biased cause I wrote the plugin myself, but it includes shortcodes for responsive videos. Now, it wouldn't be quite fair to try to sell you a solution so if you don't mind getting your hands dirty, let's rock this: 1. Wrap your embedded video in a div like

embed code

2. In your Custom CSS section, located under Custom Code in PageLines Wordpress admin, paste this: [code].video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }[/code] Here's a working example: http://bearded-avenger.com/ba-das-shortcodes/ Let us know if this works out for you. Nick

[Rob 547]

Yes, please let us know if Nick's solution works for you.