Archive for December, 2006
Someone recently asked if it was possible to somehow include jQuery in Firebug for testing jQuery code on web pages that don't already have it included.
It's not only possible to include the jQuery source right from the Firebug console, but you can also add a bookmarklet to your Bookmarks toolbar for one-click jQuery action!
Here is an example of what you could type into the Firebug console, line by line, to make a page ready for jQuery fun:
- var s=document.createElement('script');
Or, simply drag the following link to your Bookmarks toolbar:
> jQuerify <
Also, in the bookmarklet I added an alert message that says "Thank you for using jquery" when you activate it. I wanted that in there for myself because I like knowing for sure that it's working. Feel free to pluck that part out, though, if it annoys you.
Please see my entry about the
updated and improved bookmarklet .
After I wrote a couple entries (Fancy Drop Cap, Part 1 and Part 2) on creating a drop cap for the first paragraph in a DIV, a couple people asked how one would go about making the drop cap apply to every paragraph in a DIV.
I've written a Fancy Letter Plugin that does all the hard work for you. You write a line of jQuery like
$('div.content p').fancyletter(). The plugin wraps the first letter of the selected elements in a
<span> with class names that you can then style to your needs.
Most of the code can remain the way we left it in Fancy Drop Cap - Part 2. We created a
swap_letter() function to:
- find the first letter of the paragraph
- concatenate that letter with the rest of an image tag if it matches one of the letters in a regular expression
- strip the letter out of the paragraph since we want to replace it with the image
- prepend the image tag to the paragraph
We also gave the image a class name of "fancy-letter" so that we could style it a bit:Read the rest of this entry »
A couple weeks ago I wrote about traversing the DOM with jQuery's selector expressions to get any elements in the document (see How to Get Anything You Want - part 1). This time around, I'm going to focus on jQuery methods that provide even more ways to get elements. Some of these methods have a nearly identical counterpart among the selector expressions, but for the most part, the two ways of getting elements complement each other.Read the rest of this entry »