www.rogerpincombe.com Open in urlscan Pro
104.248.76.200  Public Scan

Submitted URL: http://www.rogerpincombe.com//ribbon
Effective URL: https://www.rogerpincombe.com//ribbon
Submission: On August 22 via api from US — Scanned from US

Form analysis 0 forms found in the DOM

Text Content

Roger Pincombe
@OkGoDoIt



OFFICE 2010 STYLE RIBBON TOOLBAR IN HTML/CSS/JS

June 08, 2011
Projects

I have created an implementation of the Office 2010 Ribbon toolbar that can be
used in any website. It is written in HTML, CSS, and JS. Try a demo at
https://okgodoit.com/ribbon/ or watch the video on YouTube. Download the source
from GitHub.

Some highlights:

 * Light (silver) and dark (black) themes
 * 2010-style Backstage feature (optional)
 * 2 button sizes
 * Buttons can have a disabled state
 * Tabs, sections, and buttons can all have custom HTML (such as bold or
   entities) in their titles
 * Optional hot and disabled icon states
 * Full HTML in ScreenTip (tooltip) supported
 * So far I’ve tested it in Chrome, Firefox, Safari, and IE 8+. I’m still
   working on IE 7 compatibility, and I haven’t tested it on Opera. It uses the
   jQuery framework.

There’s still a lot of work left to be done, but I wanted to get this first
version out there. Feel free to leave feedback and suggestions in the comments.

Update: I added this project to GitHub. Check there for updates and feel free to
fork it and add your own improvements.



<< Home