via Advanced docking using jQuery.

I wouldn’t mind using something like this on a website sometime. On the right site, this could be an invaluable tool.

via jQuery Highlight Plugin | bartaz @ GitHub.

This extension comes shortly after the announcement that Sitepoint have put up their JavaScript Reference.

The new extension pulls in information from their reference, at the moment it only works for the HTML and CSS reference, but once the JavaScript reference is more complete we might see that integrated as well.

FireScope is a Firefox add-on that integrates with Firebug, to extend it with reference material for HTML and CSS. The extension’s core functionality is centered around a new Reference panel, which contains a search tool for looking up HTML elements, attributes, and CSS properties. The extension also hooks into context-menus in the HTML and CSS panels, the DOM crumbtrail, and the Inspector, adding options to look up a selected item ie. search for it in the Reference panel or to view a code example.

At first glance, this little addition to Firebug/Firefox doesn’t strike one as more than just a gimmick, but it’s usefulness soon becomes apparent when trying to find out more about a CSS property or HTML element.

All in all most of us who are hardcore HTML and CSS programmers won’t always find the reference that fantastic, but it’s of course for those little used elements and properties where the reference is useful (when was the last time you used the CSS clip property? Anyone?).

One of the more useful things I’ve already become fan of, is the browser support table shown for elements and properties. This allows you to quickly see if there is a buggy implementation, or perhaps only partial support in certain browsers for whatever it is you’re trying to do.

With the 1.3.x releases, the jQuery developers have also decided to stop providing a “packed” version of the script, the reasons cited being performance and compatibility reasons. The minified (and gzipped) version is still available.

For all of us that have to deal with the massive pain that is Internet Explorer 6 – there is now finally a way to get 24-bit Alpha-Transparent PNGs to work in IE6. And all it takes is a few lines of code, ideally you’d insert these in between some conditional comments.

<script type="text/javascript" src="DD_belatedPNG.js"></script>
<script type="text/javascript">
    DD_belatedPNG.fix('.png_bg');
</script>

One major advantage is that you can use the background-position and background-repeat properties when using this method.

It does have a few limitations, but hopefully these will be resolved shortly.

DD_belatedPNG: better PNG background-image support in IE6

Rounded corners too!

From the same developer comes a solution for rounded corners in IE6 and IE7. The method involves a JavaScript function call that will add the rounded corners to the box you want to apply it to.

<script type="text/javascript" src="scripts/DD_Roundies.js"></script>
<script type="text/javascript">
  DD_roundies.addRule('.box', 10);
</script>

This call will insert some CSS so that Mozilla/Webkit browsers have a border radix added and a proper border-radius property for CSS3 compliant browsers.

For IE6 and IE7 it will add some VML code to allow these browsers to have rounded corners on boxes.

DD_roundies: Another (better?) round-corner HTML box concept

Inside any function you can access it through the variable: arguments, and it contains an array of all the arguments that were supplied to the function when it was called. It’s not actually a JavaScript array; typeof arguments will return the value: “object”. You can access the individual argument values through an array index, and it has a length property like other arrays, but it doesn’t have the standard Array methods like push and pop.

SitePoint » arguments: A JavaScript Oddity.

I love CSS, I love jquery. This sounds like an awesome solution to one of those annoying little problems. Backwards compatibility.

I know I’ll be adding stuff from here to my code library!