Horizontal icon (footer) layout for Facebook chat contacts window… kind of like the Mac OSX app bar
If you came here looking for the code, that will be a bit further down the road. Here is the plan…
Take this…
Note: The above screen has my hide offline users mod applied 
And make it look more like this…
This is a “for fun” project and will be completed as time permits. So check back soon for progress updates.
Calculate the total height of child elements of a clipped (overflow: hidden) parent tag
Ever have an element with clipped content and wanted to know the total height of the elements contained therein? I have a client who wants the height of the main content to be clipped to a preset height (don’t ask me why). Which means I need to dynamically add a “read more” link to expand the container and show all the content.
Well, here’s how you calculate the combined height of the children with jQuery… Read more
Bookmarklet: Submit a login form using javascript within a bookmark
If you’re like me, you have many bookmarks to administration areas that require authentication. For you, this script is a priceless time-saver.
Let’s say your login page has a form similar to the following…
<form action="/login.php" method="post"> <label>Username: <input type="text" name="user"></label> <label>Password: <input type="password" name="pass"></label> <input type="submit" value="Log In"> </form>
Some logins simply cannot be stored in the browser’s password system. So, to save you the extra effort of manually logging in on each visit to such pages, create a bookmark that automatically logs you into the system.
Here’s the code to submit that form using a bookmarklet… Read more
jQuery Add Bookmark to Favorites Script
Here is a quick example of how to use jQuery along with traditional browser sniffing techniques to create a dynamic “Bookmark Us” link.
Google CDN (latest 1.x version, theme)…
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script> <link type="text/css" rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1/themes/blitzer/jquery-ui.css" />
The javascript… Read more
Make the jQuery UI Datepicker use a jQuery Button
It has been bugging me for some time that the datepicker widget uses a normal button unless you tell it to use an image. Seeing that we are using the jQuery-UI framework, it makes sense to me that the button should be styled as such. After playing with the selectors and trying it a few different ways, here is how I made that boring datepicker button become a jQuery-UI button (with calendar icon). Read more