The Shapes of CSS - StumbleUpon. Learn Development at Frontend Masters CSS is capable of making all sorts of shapes.
Squares and rectangles are easy, as they are the natural shapes of the web. Add a width and height and you have the exact size rectangle you need. Add border-radius and you can round that shape, and enough of it you can turn those rectangles into circles and ovals. We also get the ::before and ::after pseudo elements in CSS, which give us the potential of two more shapes we can add to the original element.
Square Rectangle Circle Oval Triangle Up Triangle Down Triangle Left Triangle Right Triangle Top Left Triangle Top Right Triangle Bottom Left Triangle Bottom Right Curved Tail Arrow via Ando Razafimandimby Trapezoid Parallelogram Star (6-points) Star (5-points) via Kit MacAllister Pentagon Hexagon Octagon Heart via Nicolas Gallagher Infinity via Nicolas Gallagher Diamond Square via Joseph Silber Diamond Shield via Joseph Silber Diamond Narrow via Joseph Silber Cut Diamond via Alexander Futekov Egg Pac-Man Talk Bubble TV Screen Lock.
Create a Theme Store Website Layout in Photoshop. In this tutorial you will learn how to create a simple and beautiful theme store layout in Photoshop. If you have any questions about this tutorial be sure to ask in the comments. Also, remember with all the tutorials, the psd is available for download. Full Color Business Cards Digital Printing at PsPrint.com Final Result Tutorial Resources Halftone Brushes Mono Icon Pack Lets Get Started. Shuffle Letters Effect: a jQuery Plugin. Martin Angelov In this short tutorial we will be making a jQuery plugin that will shuffle the text content of any DOM element – an interesting effect that can be used in headings, logos and slideshows.
The Code The first step is to write the backbone of our jQuery plugin. We will place the code inside a self-executing anonymous function, and extend $.fn. assets/js/jquery.shuffleLetters.js (function($){ $.fn.shuffleLetters = function(prop){ var options = $.extend({ },prop) return this.each(function(){ }); }; function randomChar(type){ } })(jQuery); Next we will turn our attention to the randomChar() helper function. Function randomChar(type){ var pool = ""; if (type == "lowerLetter"){ pool = "abcdefghijklmnopqrstuvwxyz0123456789"; } else if (type == "upperLetter"){ pool = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"; } else if (type == "symbol"){ pool = ",.? We could have used a single pool string for all types of characters, but this will do for a better effect. The Plugin In Action Done Tutorials.