This repository has been archived by the owner on Dec 31, 2017. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 8
You probably want to use CSS3 PIE instead.
csnover/RoundRect
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
RoundRect Based on DD_roundies, but totally rearchitected to be less confusing, more maintainable, and more feature-filled, this library adds support for the CSS3 border-radius property in IE7 and 8, but without ANY configuration required. Rules are read directly from your stylesheets, so unlike other libraries, you *do not* need to redefine your border-radius styles within JavaScript. Just RoundRect.run() and you’ve got rounded rectangles! Features: * A svelte 4.9kB once minified + gzipped * No dependencies on external libraries * Functions even if you are using an evil library that modifies Object.prototype (you know who you are) * Properly object-oriented; no C masquerading as JavaScript here * 100% configuration-free border-radius support * Supports dynamically updating backgrounds and borders, without using polling * Supports :hover and :focus pseudo-elements (for versions of IE with native support for these pseudo-elements) * Supports input and textarea elements, and even drop-downs in IE8 * Functions properly in IE7 and IE8 strict mode * (Almost) readable code with (nearly) complete jsdoc documentation * No memory leaks! Caveats: * Only pixel units are supported for padding, border-width, and border-radius. Anything else will be assumed to be pixel width, even if it isn’t. You’ve been warned. * Dynamic updates are about as responsive as a rock star in a drug-induced coma in IE8; in IE7, more like a 90-year-old missing their hearing aids. * Sometimes, elements aren’t properly redrawn when a change causes several different elements to be restyled simultaneously (like, say, switching tabs. What a bunch of crap.) * hasLayout is required, so it might break your design when rounded elements (and their parents) are surprised with the gift of layout * Mouse events like mouseover, mouseenter, mousemove will start behaving erattically when the mouse moves over a rounded element. More specifically, hovering over an area of a rounded element that does not contain a child element will result in the mouse basically falling through the layer into VML’s cold, dead arms. There is a workaround in the code to try to mitigate this issue but it does not work 100% of the time. * Could it support more of CSS3 backgrounds and borders, like, perhaps, rgba backgrounds? HECK YES IT COULD, TOTALLY! …but it doesn’t right now. Usage: 1. Load the script. You should really use conditional comments and only load for your lovely IE visitors, but it will work even if you forget. 2. Call RoundRect.run(). 3. Have a beer. You did a great job! Advanced usage: 1. Load the script. You should really use conditional comments and only load for your lovely IE visitors, but it will work even if you forget. 2. var roundrect = RoundRect.create(element, dynamic); 3. roundrect.destroy(); // restores the original glint and shine of your html // one you decide that this web 2.0 thing kinda sucks and round rectangles // are lame and outdated. // // (in theory.) // // // … // (it hasn’t really been tested yet.) 4. Have two beers. You did twice the work, you totally deserve that extra one! Documentation: jsdoc in the source code! Go read it!
About
You probably want to use CSS3 PIE instead.
Resources
Stars
Watchers
Forks
Releases
No releases published
Packages 0
No packages published