[jQuery] Full text
[jQuery] Full text
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<META NAME="Generator" CONTENT="MS Exchange Server version 6.5.7638.1">
<TITLE>Full text</TITLE>
</HEAD>
<BODY>
<!-- Converted from text/rtf format -->
<P><FONT SIZE=2 FACE="Arial">jQuery - The Web Designer's Fix-all Tool </FONT>
<BR><FONT SIZE=2 FACE="Arial">If the rebirth of JavaScript has been the biggest theme of the past two years, you could probably divide most of the talk surrounding this topic into two main areas. </FONT></P>
<P><FONT SIZE=2 FACE="Arial">At the geekier end of town we've seen smarties harnessing JavaScript to do all sorts of amazing, and occasionally ridiculous, things with Ajax. </FONT></P>
<P><FONT SIZE=2 FACE="Arial">However for "front-end guys" like myself, much of the scripting fizz and bubble has been focussed around "refitting your markup", that is, using JavaScript to make your markup work better after it gets to the browser. Long-time Design View readers will probably remember a few of my own experiments along these lines over the past two years: </FONT></P>
<P><FONT SIZE=2 FACE="Arial">in Styling Images with the DOM (#12) we used JS to add rounded corners to images </FONT>
<BR><FONT SIZE=2 FACE="Arial">in DOM Text Shadows (#7) we used JS to build up a shadow on heading text </FONT>
<BR><FONT SIZE=2 FACE="Arial">in Horizontal Rulez! OK! (#6) we used JS to fix the dodgy <hr> tag </FONT>
<BR><FONT SIZE=2 FACE="Arial">Although each of these scripts has quite a different purpose, they all involve sending neat, semantic markup to browsers, and then using JavaScript to either fix or extend the abilities of the browsers that are smart enough to understand. In most cases this involved "wrapping" some part of your markup in some more markup. Today we're going to look at an easy, all-purpose method that will allow us to do this anytime, anywhere: jQuery. </FONT></P>
<P><FONT SIZE=2 FACE="Arial">So, what is jQuery? </FONT>
<BR><FONT SIZE=2 FACE="Arial">JQuery is yet another JavaScript library to join the already crowded space that includes Prototype, Scriptaculous, Rico, Moo.Fx and maybe a dozen others. You attach the ".JS" file in your <head> to get access to lots of pre-built functions and gizmos. </FONT></P>
<P><FONT SIZE=2 FACE="Arial">Q: Why would you possibly want another arcane Javascript library to deal with? </FONT>
</P>
<P><FONT SIZE=2 FACE="Arial">A: The key attraction of jQuery is what it can offer you within the first 10 minutes of using it. </FONT>
</P>
<P><FONT SIZE=2 FACE="Arial">As I mentioned, we've spent most of the past month working on improving the way in which SitePoint's Marketplace operates. While looking for an elegant way to allow sellers to display large screenshots, stats, graphs and other images without leaving the main auction page, we came across Cody Lindley's Thickbox, which is powered by John Resig's jQuery JavaScript library. </FONT></P>
<P><FONT SIZE=2 FACE="Arial"> </FONT>
</P>
<P><FONT SIZE=2 FACE="Arial">Thickbox speaks for itself, and five minutes of toying with it will show you its relative advantages. In the new MarketPlace, I was able to pull through both linked images and full HTML documents to the "Thickbox window" while simultaneously dimming (but not losing) the "launch page". Non-JavaScript users are simply linked directly to the item (image or page). Very clever, usable and accessible. </FONT></P>
<P><FONT SIZE=2 FACE="Arial">However since we'd already factored in the overhead of including the jQuery library (it's tiny, only 10kish), I thought it would be a good idea to find out what else it could do for us. </FONT></P>
<P><FONT SIZE=2 FACE="Arial">An hour later, I was a jQuery convert. </FONT>
</P>
<P><FONT SIZE=2 FACE="Arial">The true beauty of jQuery is its simplicity. Single lines of jQuery code can replace a dozen lines of normal JavaScript, yet it remains very elemental and flexible. </FONT></P>
<FONT SIZE=3><BR>
<BR>
*************************************************************************<BR>
This communication, including attachments, is<BR>
for the exclusive use of addressee and may contain proprietary,<BR>
confidential and/or privileged information. If you are not the intended<BR>
recipient, any use, copying, disclosure, dissemination or distribution is<BR>
strictly prohibited. If you are not the intended recipient, please notify<BR>
the sender immediately by return e-mail, delete this communication and<BR>
destroy all copies.<BR>
*************************************************************************<BR>
</FONT>
</BODY>
</HTML>_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/