Entries Tagged as 'Uncategorized'

Caching Images With JavaScript and HTML5 progress Bars

January 16th, 2012 by zoltan · 5 Comments

HTML5 Progress Bars are cool, but where would you use one? If you are have a page with a lot of images that are being animated, you may not want to the content to be visible until is all loaded into memory, so why not use a progress bar to show the load progression? This article will show how to make a simple slideshow with a progress bar that updates as images are loaded. Proof that HTML5 progress bars are useful and not just a bunch of eye-candy with a fancy name.

[

Tags: Uncategorized

Clipping JPEG Images Into Non-Rectangular Polygons Using polyClip.js

October 29th, 2011 by zoltan · 24 Comments

Up until now, if a developer needed to clip an image in a non-rectangular shape, it was necessary to save the image as a PNG with an alpha channel. If the image is a photograph, the file-size balloons up to unacceptable levels. My new library, polyClip.js, allows developers to clip these images using photograph friendly JPEGs instead. This article guides you step by step on how to use it yourself.

[

Tags: canvas · HTML5 · Images · JavaScript · jQuery · Uncategorized · VML

Fixing oninput in IE Using html5Widgets

May 12th, 2011 by zoltan · 2 Comments

Even though onforminput is deprecated, oninput will allow developers to do dynamic calculations on forms with little JavaScript knowledge. Unfortunately, it doesn’t work in IE8 and lower, and there are some small bugs in IE9’s implementation when trying to delete characters inside a form field. So I implemented a fix for these issues with an update to my cross-browser HTML5 Forms polyfill, html5Widgets.

[

Tags: Events · Events · Forms · HTML · HTML5 · JavaScript · Polyfills · Uncategorized

CSS Blurred Text-Shadow in IE — Part I

April 23rd, 2011 by zoltan · 16 Comments

Last week, I discussed several strategies web developers can use to simulate CSS text-shadow in IE. In that article, I mentioned that there was no way that I knew of to simulate text-shadow with a blur-radius in IE without JavaScript. Since then, I have discovered a way to simulate the CSS text-shadow effect in IE9 that does not use JavaScript and does not add extra elements to the DOM.

[

Tags: CSS3 · IE Visual Filters · text-shadow · Uncategorized

CSS3 Text-Shadow – Can It Be Done in IE Without JavaScript?

April 14th, 2011 by zoltan · 15 Comments

CSS3 text-shadow rocks, but it doesn’t work in any version of Internet Explorer, including IE9. While it is impossible to replicate all text-shadow effects in The Browser That Likes To Be Difficult, there are some ways to emulate this effect without JavaScript using Visual Filters, even when ClearType is enabled. This article can show you how and contains lots of examples.

[

Tags: ClearType · CSS3 · IE Visual Filters · text-shadow · Uncategorized

Pixel Perfect CSS3 border-image In Depth.

March 29th, 2011 by zoltan · 15 Comments

Using the CSS3 border-image property, you can make coo graphical borders without cutting up images to bits. There are a few gotchas that developers should be aware of before implementing it and this article will cover these caveats, a tool that you can use to help generate border-images effectively, and a few strategies to ensure it gracefully degrades in older browsers

[

Tags: border-image · CSS3 · Uncategorized