Yesterday I finished my latest endeavor of the explorations of the amazing world of HTML5 Web Components. I must say that the deeper I get into the topic, the more I understand their importance, and I am pretty sure that very soon (even much sooner that I dared to speculate a couple of months ago) … Continue reading “Extended File Upload Input, Wrapped as a HTML5 Web Component”
One of my experiments with atypical uses of radio buttons I blogged about sometime ago was the CSS3 Driven Slides Viewer Without any JavaScript, and soon after it was published, became one of my most popular posts, but busy with other stuff I never took the time to extend or improve it. Until yesterday, when … Continue reading “Slides Viewer: HTML5 Web Component”
Just finished my new experiment with HTML5 Web Components and Mozilla X-Tags, called X-Password. What you get is a JavaScript-less extended password input, allowing Windows 8-like password reveal behavior out of the box: [sourcecode language=”javascript”] <acidjs-xpassword></acidjs-xpassword> [/sourcecode] The input supports all JavaScript getters, setters, events and form submission is handled natively. X-Password does not have … Continue reading “X-Password: HTML5 Web Component Input on Steroids”
People who follow this blog (cheers, mates!) and my fellow co-workers know that I am interested in the form control styling, and especially that of check boxes and radio buttons. Over the years I have come up with a number of different solutions, but finally I found the time to start experimenting with the new … Continue reading “X-Checkbox – Custom HTML5 Web Component”
Radio buttons and checkboxes are traditionally associated with forms and data, however if you spend some time playing with these elements and CSS you will certainly find a lot more possible and not so boring uses. Here are a few, which will maybe give you ideas and will inspire you. Star Rating Widget Fully functional … Continue reading “Atypical Uses of Radio Buttons and Checkboxes for Building Interactive UI Widgets”
Just before the weekend, here’s a pure CSS3 implementation of a rating star system with support for selection and hover, made-up by radio buttons, rtl, generated content, minimal markup and sibling selectors. Enjoy the weekend! Related Posts and Links Animated CSS3 CD Cases on a Shelf Animated 3D Chessboard With Pure CSS3. No Images. No … Continue reading “CSS3 Rating Stars with Hover and Selection”
Try Semtex – the new HTML5, CSS3 and JavaScript UI framework! Say hi to AcidJs.Forms, the successor of one of the oldest components in Acid.JS Web.UI – Forms.JS! AcidJs.Forms is a powerful component that will give you total control over the form elements on your page without any additional markup or sophisticated JavaScript. The component … Continue reading “Skinnable CSS3 Metro Forms”
Try Semtex – the new HTML5, CSS3 and JavaScript UI framework! Here’s a quick and dirty CSS3 solution that will give cool metro look and feel to your HTML drop downs without a single line of JavaScript and minimal additional markup (actually just one wrapping <span />). You may also want to check AcidJs.Forms for … Continue reading “CSS3 Metro Dropdown Styling”
Try Semtex – the new HTML5, CSS3 and JavaScript UI framework! My latest experiment, a follow up to an earlier CSS3-only solution. Check the demo and implementation on this page and have fun! Related Posts Semtex HTML5, CSS3 and JavaScript UI Framework HTML5 Canvas Gauge HTML5 Shopping Cart CSS3 Treeview. No JavaScript. CSS3 Driven Slides … Continue reading “HTML5, CSS3 and JavaScript iPhone Toggle Switch Button”
The code for today is a fully functional CSS3-only tabstrip, which works without a single line of JavaScript and natively supports keyboard arrow navigation. The CSS In short – we have a list with radio buttons, <label />s and <div />s. We hide each <div />, which is the content of the tab according to … Continue reading “Fully Functional CSS3-only Tabstrip Without any JavaScript”