You are likely living in civilized society with Firefox, Safari, Chrome or Internet Explorer 7/8 installed in your computers. Yet, some are still in the dark with the older Microsoft browsers named Internet Explorer 6 (IE6) or, worse, older versions. One of the most painful facts about IE6 is that it does not natively support PNG alpha-channel transparency.

Microsoft probably thought that GIF transparency — where each pixel is either fully transparent or a solid color, not anything between — should be enough for the world. But it’s not! Just compare three “JavaScriptly” logos in transparent GIF, transparent PNG and semi-transparent PNG images on a web page, you’ll recognize the differences.

• View Non-Fixed PNG Demo

Transparent PNG vs Transparent GIF

(1) The font edge of GIF logo has side-effect which can be only fixed by choosing “color matte” exactly like background color when exporting the image (but we can do nothing optimal if the background has multi-colors like a picture.)

(2) Only PNG can be semi-transparent like the last logo, GIF is out of luck.

Read the rest of this entry »

Recommended Reading

HTML5: Up and Running

If you don't know about the new features available in HTML5, now's the time to find out. The latest version of this markup language is going to sig... Read More >

HTML, XHTML and CSS All-In-One For DummiesA complete and fully updated reference for these key Web technologies

HTML, XHTML, and CSS are essential tools for creating dynamic Web sites. This ... Read More >

HTML, XHTML, and CSS: Your visual blueprint for designing effective Web pages (Wiley Desktop Editions)If you’ve ever been curious about any of the multitude of internet acronyms, the web technologies they represent, and how they can benefit you, this... Read More >

Now it is time for Christmas and if you want to add some snows to a picture like the below example, a cool jQuery plugin — created by Jason Brown — can come to help.

• View Live Demo
• Download Plugin

Read the rest of this entry »

I know quite a few JavaScript MVC frameworks out there but corMVC is what makes me exited at most for a few reasons.

corMVC stands for “client-only-required” Model-View-Controller and that means it does not depend on specific server-side technology. In case you want to demo something, it would be perfect if everything can be done on client side. Of course, you can save changes or load data from server (via Model) as the general illustration below.

corMVC Overview

Not like other JavaScript MVC solutions, corMVC is very simple and has very small footprint. It also does not require you to build the application using scaffolding or any other command-line utilities.

Read the rest of this entry »

Recommended Reading

jQuery Cookbook: Solutions & Examples for jQuery Developers (Animal Guide)

jQuery simplifies building rich, interactive web frontends. Getting started with this JavaScript library is easy, but it can take years to fully re... Read More >

Professional ASP.NET MVC 3 (Wrox Programmer to Programmer)New edition of the top book on MVC from the top ASP.NET experts at Microsoft!
MVC 3 is the latest update to Microsoft's Model-View-Controller tec... Read More >

Beginning ASP.NET MVC 1.0ASP.NET MVC (Model View Framework) allows you to use ready-to-use MVC code so you can develop Web applications faster. This book?s cut-to-the-chase ap... Read More >

Installation

FireQuery is an extension of Firebug created by BinaryAge to help developers to keep track with jQuery expressions, data and collections as expressed on tool website:

• Query expressions are intelligently presented in Firebug Console and DOM inspector
• attached jQuery data are first class citizens
• elements in jQuery collections are highlighted on hover
• jQuerify: enables you to inject jQuery into any web page

You can install the tool from official Mozilla add-on page (it requires Firebug 1.3+ already existed.) One note: You may have to find an older version (v0.3) to make it work with current official Firebug release (v1.4) as my experience on Windows.

In Action

After installing the add-on and restarting Firefox, just go to the test page to see how FireQuery tracks embedded jQuery data on FireBug’s “HTML” tab. The image below illustrates the data embedded in accordance with the jQuery codes to inject them to the page.

Read the rest of this entry »

Recommended Reading

JavaScript & jQuery: The Missing Manual

JavaScript lets you supercharge your HTML with animation, interactivity, and visual effects—but many web designers find the language hard to lear... Read More >

CSS: The Missing Manual

Cascading Style Sheets can turn humdrum websites into highly-functional, professional-looking destinations, but many designers merely treat CSS as ... Read More >

Evernote For DummiesThe fun and easy guide to using Evernote for everything that's noteworthy

Voicemail, email, things to do, things to get, people you know, places you... Read More >