Equal height columns using CSS

PostFeb 8th, 2010 | Comments (0)
Position is Everything has an old, but still valid and amazingly simple way to create columns of equal height using very simple CSS.

In short: Give the columns a large padding-bottom value and a negative margin-bottom of equal value, and set the overflow to hidden for the containing <div>.

HTML code:

<div id="container">
    <div class="column">
        Left column
    </div>
    <div class="column">
        Right column
    </div>
</div>

CSS:

#container {
    overflow: hidden;
    }

.column {
    float: left;
    padding-bottom: 5000px;
    margin-bottom: -5000px;
    }

There are three known problems with this solution, however, so make sure your site won't be affected before using this solution:

View the known problems

Toggle a checkbox using jQuery

PostJan 30th, 2010 | Comments (0)
If you're using jQuery and you need to toggle a checkbox, add this onclick code to an object:

onclick="$('#id_of_checkbox').attr('checked',!$('#id_of_checkbox').attr('checked'));"

The above code sets the "checked" attribute of the checkbox to the opposite of itself, i.e. checked -> unchecked or unchecked -> checked.

jQuery Datepicker appears behind dialog box

PostJan 11th, 2010 | Comments (0)
If you're using jQuery's built-in dialog box plug-in and you want to add a Datepicker field to a dialog box, you'll notice that the Datepicker opens behind the dialog box by default.

A quick and easy solution to force the Datepicker to appear in front of the dialog box is to give the Datepicker a really high z-index.

Just add this to your CSS file:

#ui-datepicker-div {
    z-index: 10000;
}

Hannah's Bretzel website is live!

PostOct 22nd, 2009 | Comments (0)
Well, ok, the Hannah's Bretzel site actually launched a few weeks ago, but I finally just uploaded some screenshots from the project.

View the Hannah's Bretzel screenshots


How to fix yum dependency errors

PostAug 29th, 2009 | Comments (0)
This may not help everyone (or anybody) who's having a yum dependency problem, but I thought I'd share just in case.

I recently ran "yum update" and was getting a bunch of weird dependency errors. The command that magically fixed everything was:

yum clean all

After running "yum clean all," I was able to run "yum update" with no errors.

From the yum man pages:

"yum clean packages"
Eliminate any cached packages from the system. Note that pack-
ages are not automatically deleted after they are downloaded.

"yum clean headers"
Eliminate all of the files which yum uses to determine the
remote availability of packages. Using this option will force
yum to download all the headers the next time it is run.

"yum clean all"
Runs yum clean packages and yum clean headers as above.

Coverbuga and Restaurant Intelligence Agency

PostAug 4th, 2009 | Comments (0)
I just added a bunch of screen shots from my latest couple client projects:

Restaurant Intelligence Agency




Coverbuga


How to use JSON in PHP 4 or PHP 5.1.x

PostMar 16th, 2009 | Comments (1)
Here's an easy forward-compatible way to use JSON (json_encode() and json_decode()) in versions of PHP earlier than 5.2.

Download the Services_JSON PEAR package

And then add the following to your custom functions:

if (!function_exists('json_decode')) {
    function json_decode($content, $assoc=false) {
        require_once 'classes/JSON.php';
        if ($assoc) {
            $json = new Services_JSON(SERVICES_JSON_LOOSE_TYPE);
        }
        else {
            $json = new Services_JSON;
        }
        return $json->decode($content);
    }
}

if (!function_exists('json_encode')) {
    function json_encode($content) {
        require_once 'classes/JSON.php';
        $json = new Services_JSON;
        return $json->encode($content);
    }
}


That's it! Your code will continue to work, even when you eventually upgrade to PHP 5.2.

PHP/MySQL: Setting a field to NULL if a form field is left blank

PostFeb 11th, 2009 | Comments (2)
For those of you working with PHP and MySQL who want to set a field in MySQL to NULL if the corresponding field in an HTML form is left blank, here is a slick trick:

UPDATE table_name SET date_field=IF('$date_value'='',NULL,'$date_value')

For text fields this isn't a huge deal, but for any of the formatted field types like "date" or "decimal," setting them equal to an empty string (i.e. '') results in them having values like 0000-00-00 and 0.00. So this little "if" shorthand in MySQL is a great solution.

Add a pause or delay in jQuery

PostFeb 6th, 2009 | Comments (4)
Karl Swedberg over at Learning jQuery has a great trick for pausing during a jQuery effect chain.

Here's an example that fades an object in, pauses for 3 seconds, and then fades the object out.

$("#some_object").fadeIn().animate({ opacity: 1.0 },3000).fadeOut();

Notice the animate() in there. All it does is change the opacity of an object from 1.0 to 1.0 (i.e. do nothing) over the span of 3 seconds. Brilliant.

Testimonial Generator

PostDec 31st, 2008 | Comments (0)
For web designers out there who need a few quick and dirty testimonials to use as place-holders, check out the Testimonial Generator.

Just don't be an asshat and try and pass them off as real testimonials by posting them as comments on your own website:

(I refuse to link to these sites and give them even a miniscule Google Rank boost.)

* http://www.surveyspaidfor.com/surveys-paid-online/get-paid-for-taking-online-surveys-150-per-hour

* http://www.beststeps2freedom.com/
Visit the archives to see older posts