- Site Template
- WordPress Theme
- Blogging Theme
- CMS Theme
- Marketing Template
- eCommerce Theme
- Forum Theme
- Flash Template
- PSD Web Template
- .NET Script
- PHP Script
- HTML5 Code
- CSS Style
- Edge Animate Template
- Muse Template
- TypeEngine Theme
- Static Site Generator
- Sketch Template
CodeCanyon Ribbon Player HTML5 Animated Video Player 2568055
HTML5 Code \ Media
Player \ Mobile \ Ribbon \ Video \ Wrap \ VideoJS \ Iphone \ Ipad \ Colors \ Animation
HTML5 Code - Ribbon Player HTML5 Animated Video Player 2568055 by iamalexkempton @ CodeCanyon
HTML5 Code \ Media
Robust HTML5 player that supports 99% of browsers
When you hover over the video, the controls animate in like a ribbon, wrapping around the video. It is incredibly customisable with 8 different colours and 5 additional styles to choose from. Check out the video preview to see it in action!
Ribbon Player doesn’t just look awesome . It is built on the wonderful open source library, video.js . The player has HTML5 awesomeness for new browsers/mobile devices and falls back to a Flash player for older browsers.
To see the ribbon animation, please view the video preview above. If you want to test the player, head to the limited example .
Please note that the animation is not complete in this example, and is only provided so you can test out the player.
- Chrome – Full animation, HTML 5 support
- Safari – Full animation, HTML 5 support
- Firefox – Full animation, HTML 5 support
- IE9 – No animation, HTML 5 support
- IE8 /IE7 – Basic appearance, Flash support
- Works in any mobile device that supports HTML5 video (Android, iPhone, iPad, Blackberry)
- Works in almost any browser, including your favourite mobile devices
- Unique CSS3 “ribbon wrap” effect on hover
- Optional “lights out” feature when video plays
- Video automatically stops playing if another one is played
- 80 colour/style combos! Go crazy!
- Simple setup
- Great documentation, even with some tips on encoding
Compatible with Ribbon Wrap
Ribbon Player is compatible with Ribbon Wrap , another item by me. Ribbon Wrap is the sister to Ribbon Player, incorporating the beautiful ribbon animation into the rest of your site, use it for headers, titles, descriptions, etc.
- Video.js – Fantastic open source video library the player is built on (hosted by Level 3).
- Big Buck Bunny – Trailer video used in examples.
- Sintel – Trailer video used in examples.
- Ultimate CSS Gradient Editor – Used to generate all CSS3 gradients in ribbons.
- 1.1 – 28.06.2012 – Updated “rw-player.js” – Fixed “lights out” z-index bug.
Ribbon Wrap - CSS3 Hover Animation.
Keywords: android, animation, colors, css3, customisable, html5, ipad, iphone, mobile, player, ribbon, video, videoJS, wrap.
Android, Builder, Business, Clean, Corporate, Creative, Design, Ecommerce, Email, Fashion, Gallery, Image, Iphone, Jquery, Landing, Magazine, Magento, Marketing, Minimal, Mobile, Modern, Multi, Multipurpose, Online, Parallax, Personal, Photography, Plugin, Portfolio, Product, Responsive, Simple, Slider, Social, Store, Template, Theme, Video, Woocommerce, Wordpress
Show all tags
Show all tags
- ThemeForest Plan- Bussiness PSD Template 19579772
- ThemeForest Cizarua Responsive One Page Portfolio Template 19585446
- ThemeForest Lost In Forest Responsive Error Page 19566645
- ThemeForest RE CV Portfolio Responsive Template 19585496
- ThemeForest Alavon Responsive Multipurpose HTML5 Template 19561582
- ThemeForest Folder Freelancer One Page Portfolio & Resume PSD Template 19515733
- ThemeForest Julia Responsive WooCommerce WordPress Theme 19551582
- ThemeForest Hauslr Single Property WordPress Theme 19574945
- ThemeForest Polaroid Unique Personal Blog Theme for Wordpress 19405082
- ThemeForest TheFlow Blog HTML Template 19580482