This snippet will generate a simple 3-angle clock, inspired by 3Angle Watch Face See the Pen React Morph Clock by Siddharth Parmar (@Siddharth11) on CodePen. http://codepen.io/Siddharth11/pen/rrrgZN/
React Morph Clock
Some great Star Rating widgets by CSS
Below are some great scripts to create a star rating widget. You can integrate to any where on your website. CSS Rater with SVG http://codepen.io/rogie/pen/jgrIu Pure CSS Star Rating Widget https://codepen.io/jamesbarnett/pen/vlpkh CSS Star Rating System http://codepen.io/lbngoc/pen/JRRgWP Star Rating with CSS http://codepen.io/lbngoc/pen/ZppgKw
Efficiently Detecting IE Browsers
This is a blanket check for IE in general. If you need to check for a specific version of IE, you can compare what comes back from the documentMode to determine what version of IE is being used. You can then add a specific class to code for that instance.
Checking if Font Awesome loaded
Icon fonts have become a widely-adopted visual asset on the web today and continue to grow in popularity. When your web page downloads resources — e.g., from a content delivery network (CDN) — you need to know if the HTTP request returned the files you requested. This is important whether it’s a JavaScript library, CSS… continue reading
Autoprefixing, with CSS variables!
In this article we will find out a neat trick one can do with CSS variables, precisely due to their dynamic nature. Let’s say you want to use a property that has multiple versions: an unprefixed one and one or more prefixed ones.
Simple PHP Templates
This is a simple PHP based template where the variable fields in the template are enclosed in double parenthesis and the actual values are passed in a single array. The entire substitution happens in one step using preg_replace. If your template string is long, you can either put that in a separate PHP file (and… continue reading
AngularJS Form Validation
Today we’ll be looking at at the ways that Angular helps us do form validations. We’ll be talking more on forms using Angular. Don’t worry though, that article is not required. We’ll focus on client side validation and using the built in Angular form properties.
Scroll-Then-Fix Content
A reader sent me in a GIF showing off a cool effect they saw on Google on mobile. (Presumably the homepage you see when you launch Chrome on Android?) Ther
Cropping Image Thumbnails with SVG
Many techniques for cropping image thumbnails on the front-end require explicit dimensions, which is less than ideal for responsive design.
Pretty dropdown menu (jQuery)
Sample for dropdown menu when mouse over with jQuery and CSS
Drop Caps by CSS3 and cross-browser ways
Drop Caps Cross-browser way (extra markup) Just wrap the first character of the paragraph in a span, then target the span with CSS and style away. <p> <span class=”firstcharacter”>L</span> orem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tristique lobortis orci ac lacinia. Fusce eu purus eget diam vehicula auctor nec eu elit. Morbi consequat… continue reading
CSS Counters drag-and-drop demonstration
CSS counters allow you to number items in CSS using dynamic numbering, similar to how an ordered list works. But CSS counters are quite different. This feature uses a pseudo-element combined with some counter-specific CSS to append/prepend a dynamic “count” to a specified set of elements.