YUI Based Lightbox – Revisited
Note: This script has been updaed
In the previous article of YUI based lightbox, I've shown you how easily one can create a lightbox using YUI's Dialog class. Although the lightbox we created in the previous article has the basic skeleton of a lightbox, it still lacks some crucial features and it looks quite ugly. Luckily YAHOO released YUI 2.3.0 not long ago, which included an eye candy skin (sam) that is more attractive than one bundled by default. We will use the new skin for the revised lightbox. Since we don't need all the features provided by the Dialog class (e.g., submitting data), I replaced the Dialog class with Panel for the container class of the new lightbox.
A picture is worth a thousand words, so here is a screen shot of our new lightbox:
I might have mentioned this before, but I couldn't address enough the helpfulness of a JavaScript framework in dealing with cross-browser compatibility issues. By using a framework, the new lightbox is compatible with majority A-Graded browsers and it was created with minimal effort. Once again, it has been tested in the following browsers: Firefox 2.0.0.6, Netscape 8.1, IE 6, IE 7, Mozilla 1.7.13, Opera 9.21.
Debug JavaScript with Firebug
Writing JavaScript is easy, but debugging is not due to the very limited debugging functionalities provided by the JavaScript language itself. One of such limitations is that there's no effective way to display debugging message other than embedding a bunch alert boxes or a million lines of document.write in the JavaScript code. Fortunately, external debuggers can more or less help developers to overcome these limitations and make debugging more pleasant.
Creating Lightbox with Yahoo! User Interface Library
Demo Updated (8/29/2007): In addition to the image lightbox demos, I added four more types: text content, web page, web page with video, and embedded video. Check it out.
Yahoo! User Interface Library (YUI) provides a very handy class for creating modal dialog box with background masking, which can be used to create lightbox. If you have no idea what a lightbox is, you can run this online demo to get a taste of what it looks like.
There are several advantages to use YUI to create lightbox. The most important one is you get cross-browser compatibility support out-of-box. The above demo has been tested in IE 6, Firefox 2.0.0.4, Netscape 8.1, Mazilla 1.7 and Opera 9.21, which was created without any hacking. Another hot feature is that one can easily create a drag & drop lightbox without any extra effort.
Read more »
Firefox Download Window Bug
If you are experiencing Firefox download problem, in which case the Download window no longer shows up when performing download and "Save Page As" is no longer saving any web pages, your Firefox configuration file might have been corrupted.
I had this problem for almost three months now. I have tried almost anything that I can think of: clean install, messing around settings in Options, removing themes and extensions. None of which have worked. Problem persists until recently I ran into a site which is trying to solve exactly the same problem. It turns out my Firefox download configuration file, downloads.rdf, is corrupted.
Read more »
How to Browse Wikipedia Offline/Locally?
Update (8/14/2007): This article is outdated due to incompatible of Wikifilter and the latest Wikipedia XML dump file. Check comments for the workaround.
Although the credibility of Wikipedia is not well respected among academic communities, that doesn't stop Wikipedia from becoming the most popular encyclopedia on the web. According to the update-to-date statistics, the English Wikipedia contains almost 2 millions articles. Don't scream if I tell you that you can store all articles in English Wikipedia in your computer and view them locally, because you can.
Read more »
Loading ...