Lab notes

HTMLMay 10, 2005 3:18 pm

Drag & Drop Sortable Lists

Using JavaScript and CSS to allow the user to re-arrange a list of items by dragging & dropping them.

Showing & Hiding a DIV

I’ve used a similar script in a different blog to show and hide the comments in-line. Each post would have a comment link at the button, but clicking on the list will expand the list of comments and comment entry form directly under the post, without reloading the page. This site explains how to do it using JavaScript and CSS.

Resizeable Textarea

Doesn’t it always seems like the comment box is just not big enough? This nifty script adds a draggable icon that allows the user to resize the textarea box. I have to say it’s a big buggy on my browser (Firefox).

Docking Boxes

Docking boxes (dbx) adds animated drag ‘n’ drop, snap-to-grid, and show/hide-contents functionality to any group of elements. The best of the first two combined, this script allows you to expand and collapse each of the boxes, and drag them around. The animation effect is top rate.

Hover Help

A text pop-up that floats when you hover over the element. aka tooltip.

HTML, CSS 12:47 am

Lifehacker pointed me in the direction of the Firefox Web Developer extension. Developed by Chris Pederick, this extension adds a menu and toolbar to Firefox with a whole slew of features: view and edit CSS stylesheets, validate content, change forms, resize to specific screen size, and so much more. The full feature list is here.

Link

HTML, CSSMay 4, 2005 6:39 pm

Christian has a cool trick for creating XML buttons using HTML content and CSS styling. It’s really that simple, see: Lab Notes

HTML, CSS, PHP 6:21 pm

ILoveJackDaniels has nice cheat sheets for PHP, CSS and RGB colors. The cheat sheets are provided as PNG images that print nicely on A4 at 600dpi.

PHP cheat sheet   CCS cheat sheet