Use Coldfusion to Deliver Video Based on Device

Competetive Marketing

Use Coldfusion to Deliver Video Based on Device

[Category: Programming]
Jun. 23, 2019

Coldfusion Code

If you happen to visit Robert on a mobile device versus a desktop computer for the main page you will notice that the video is different for both. The same holds for all of the other pages on the site except, instead of the video the visitor is shown an image, to cut down on repeating the same video over and over. The image swapping out is done using HTML and CSS, however, in the case of video, that feature is no longer supported by CSS.

Our solution was taken from However, the Adobe site had an error, leaving off "properties" from "". I found the solution after multiple attempts with many forums claiming it to not be possible using Coldfusion alone.

    <cfclientsettings detectDevice=true />
   <cfif cfclient.width lte 480 >
    <!--Screen is less than or equal to 480 pixels do this -->
    <cfelseif gte 480 AND lte 760>
    <!--Screen is greater than 480 pixels but less than 760 pixel do this -->
    <!--Screen is larger than 760 pixel do this -->

There is a limitation you need to be aware of; this is not like an image using CSS to deliver a custom image based on your screen size. In the case of CSS the image will change when you change the size of your browser or when you rotate your phone. Since this technique is checking the screen size on the page load, any change to the size of the screen or the orientation will not change the video. To view the differences you will need two view it on a desktop and a tablet/smartphone to see the different versions.

As for the HTML code for the video itself... Note you can leave off the title, alignment, controls, remove muting, turn autoplay off, and not let it loop. I left them in so that you don't have to go fishing for any of the most common settings.

    <video title="Title of the Movie" preload="auto" width="auto"   
    height ="auto" align="center" controls="controls" muted="muted" autoplay="autoplay" loop="loop">
    <source src="filename.mp4" type="video/mp4">
    <!--if the browser does not support video show this message-- >
    <p>Custom Message - Your browser does not support video.</p    >
Share this page now!

Visitor Comments: Average Rating - 5 Stars [COMMENTS CLOSED] Note: Pages are moderated.

5-Star Rating

Thanks for the tip it took two tries but it's working now. I don't understand why Facebook doesn't make these types of things easier to install.

PenPal [Jul. 23, 2019]

Newest Articles...
The problem with monthly subscriptions
[Shopping] Nov-04-2019: Lured by low monthly fees, subscriptions are bleeding people and businesses dry.
Malicious Apps on iOS
Apple Fails to Stop Trojans Causing a Drain on Pay Per Click
[Web/SEO] Oct-24-2019: Malicious apps on iOS are faking visitors and stealing competitors PPC budgets.
Money Mailer / ValPak
To Advertise in Print or Not
[Business] Oct-22-2019: Sometimes print advertising makes sense especially when on a tight budget.
Empty Shopping Carts
Empty Shopping Carts eCommerce Nightmare
[Web SEO] Oct-04-2019: Companies are spending thousands on websites and competing with themselves on Amazon and discount sites.
Traffic on websites
Those Discount Magazines In The Mail They Work
[Business] Sep-27-2019: Advertisers are finding printing a less expensive affordable way of advertising once again.
Additional Articles Continued...
Robert Furst Competitive Marketing • 22052 Las Brisas Circle • Boca Raton • Florida • 33433 (754) 307-4954
LinkedIn    Twitter    Messenger    Facebook    Pintrest
©2019 -
RF-. All rights reserved.   Privacy & Usage