PUBLIC MARKS from sbrothier with tags javascript & css

CURVING TEXT WITH CSS3 & JQUERY

These are just a few examples of what can be done using the CSS Text Wrapper. Note that the wrap shape stays constant regardless of font or content. The examples on this page use the javascript method to apply them to the site. There are two other ways to create the wrap without using javascript and that are purely CSS/XHTML.

Creating custom dropdowns is usually a tedious process that requires a ton of extra setup time. Oftentimes lacking conveniences that native dropdowns have such as keyboard navigation. DropKick removes the tedium and lets you focus on making s@#t look good.

Fancy checkboxes and radio buttons with CSS Many young guns ask about how to style custom checkboxes and radio buttons in forms. I prepared a typical markup, a few lines of CSS and some JavaScript functions (Safari label behavior fix included).

When I saw the 10 billion song counter on Apple’s website yesterday, I immediately right-clicked on it to see if it was flash. No big surprise to see that it wasn’t (this being Apple), and when I saw it was done using JavaScript I knew how I’d be wasting the next few hours.

A tribute to the awesome wonder-wall by tha.ltd. And a demo of WebKitCSSMatrix. The wonder-wall effect is inspired by this great example, the Javascript Matrix library used is this, and the book covers are taken from here. The interesting stuff is the possibility of manipulate the transformation matrix of any element of the DOM, In this case we get the matrix given only the 4 end points of the element, which is done porting OpenCV's cvGetPerspectiveTransform function and some trickery, the JavaScript code is here. Right now the effect only works in Safari 5 (best) and Chrome 7 Dev. Roll over the elements and click them.

veryone wants @font-face to work everywhere, but as it stands, it only works in Safari and the upcoming versions of Firefox and Opera. In this article I’ll show you how to use Cufón only if we can’t load the font through other, faster methods.

Cufón aims to become a worthy alternative to sIFR, which despite its merits still remains painfully tricky to set up and use. To achieve this ambitious goal the following requirements were set: 1. No plug-ins required – it can only use features natively supported by the client 2. Compatibility – it has to work on every major browser on the market 3. Ease of use – no or near-zero configuration needed for standard use cases 4. Speed – it has to be fast, even for sufficiently large amounts of text And now, after nearly a year of planning and research we believe that these requirements have been met.

Even though sIFR has been around for a couple years, many web designers have still never heard of it, let alone use it. sIFR (or Scalable Inman Flash Replacement) allows you to use custom typography on your site by utilizing JavaScript, Flash, and CSS. While most people simply create images when they need a custom-type title, sIFR can dynamically create short text blocks using whatever font you want (while still rendering the text with a default font on non-Flash browsers).

File inputs (input type="file") are the bane of beautiful form design. No rendering engine provides the granular control over their presentation designers desire. This simple, three-part progressive enhancement provides the markup, CSS, and JavaScript to address the long-standing irritation.