Ribbon JS

HTML5, CSS3 and JavaScript Ribbon Bar. State-of-the-art UI. By Martin Ivanov.

Ribbon Features and Tools


Tools

The latest version of Ribbon JS boasts a huge set of inbuilt tools and the ability to seamlessly add custom tools through its rich API and client-side templates. Here's what we've got (and don't forget to check the demos to see these in action):

Features

They say "a picture is worth a thousand words", so don't forget to check the live demos of Ribbon JS.

  • Comprehensive and fully documented API with powerful methods and events, allowing full control of ribbon's behavior
  • Support for multiple ribbon instances on a single page
  • CSS3 skinnable
  • Inbuilt support for Metro (MS Office 2013+ look and feel) and Classic (pre MS Office 2014) style ribbons
  • Could be run as a full-blown HTML5 WebComponent (custom tag)
  • Fully client-side
  • Configurable via JSON
  • Custom events
  • Support for tab grouping with custom highlight colors and labels
  • Support for custom application icon
  • Huge set of inbuilt tools
  • Support for tool buttons with text
  • Support for small and large buttons and split buttons
  • Capability to seamlessly add custom tools via client-side templates
  • If dropdown tool name is "font-face" its items items are automatically styled with the font which has been set
  • If dropdown tool name is "font-size" its items are styled with the font-size itself
  • Support for optional and fully customizable File Tab Menu
  • Ribbon expand/collapse functionality.
  • Support for optional and fully configurable Quick Access Toolbar
  • Support for load on demand
  • Support for load via AJAX
  • Support for AngularJS directives
  • Responsive, supporting width and min-width
  • Flexible licenses

Supported Browsers


  • Chrome
  • Firefox
  • Apple Safari
  • Opera Presto
  • Opera Webkit
  • Opera Vivaldi
  • Internet Explorer 9+ (Due to the poor CSS3 support the UI appears a bit different on IE9)
  • Any other HTML5 and CSS3-capable browser