VIEW DEMO HERE

LINK jQuery:

Absolute – <script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js”></script>

Or Relative - <script type="text/javascript" src="jquery-1.4.2.min.js"></script>

You can download the latest version of jQuery HERE

THE HTML:

Below we can see that this menu uses a basic unordered list setup and we position the subnavs so that we can center them easily under the parent nav item.

<ul id="main-nav">
    <li><a href="javascript:;">Link</a>
        <div class="subnav">
             <ul style="position: relative; left: 130px;">
                <li><a href="javascript:;">Link</a></li>
                <li><a href="javascript:;">Link</a></li>
                <li><a href="javascript:;">Link</a></li>
             </ul>
        </div>
   </li>
</ul>

THE CSS:

VIEW THE CSS HERE

THE jQuery:

We can use slideToggle to animate the subnav drop downs.

$(document).ready(function() {
    $('#main-nav li .subnav').hide();
    $('#main-nav li').hover(function() {
        $(this).find('a').addClass('active');
        $(this).find('.subnav').slideToggle(80);
    }, function() {
        $(this).find('a').removeClass('active');
        $(this).find('.subnav').slideToggle(80);
        });
    });

I hope you enjoyed this tutorial. Please feel free to modify and improve upon this simple hMenu. If you have any questions or comments please feel free to list them in the comments field below.

DOWNLOAD THE SOURCE FILES HERE

I’ve started to design more and more with grids and intend to start checking out some actual development grids to use in the browser. I’m open to suggestions. I’ve heard some talk about Blueprint CSS. I would also love to hear about what’s going on in your techie mind and any comments you may have about any of these subjects.

Here are some posts/sites that I’ve been viewing on these subjects:

CS5 Brings Sexy Back
HTML 5 Layout From Scratch
HTML5 Doctor
W3C HTML5
HTML5 Gallery
Power of HTML5 and CSS3
HTML5 and the Future of Web
CSS Grid Systems
Crockford on Javascript
HTML 5 and CSS3: The Techniques You’ll Soon Be Using
The Gradual Disappearance of Flash Web Sites
Projekktor
HTML5 Features you Should be Using Right Now

My brother Ryan Hartsell and his film partners Justin Hilliard and Arianne Martin have just come back from a month long road trip promoting their movie, The Other Side of Paradise. With valiant and enduring efforts they have managed to get into multiple film festivals, winning awards, and have also obtained a week long theatrical in New York. Also to mention they have recently been added onto Apple.com Trailers for the second time. View Here. I ask in support of independent film, family, friends, and of course this entertaining film, that you purchase tickets for the theatrical release in New York. Even if you can’t attend or are not in the New York area please support independent film as a donation. Purchase a ticket for a NYC show (show receipt) & you’ll get a copy of the soundtrack!!! So for those out-of-towners, you won’t be walking away empty handed. Plus, the soundtrack is amazing!

Just select a showtime on a date from 12/18-24th – Purchase Tickets Here

Other Links:
Official Movie Site
The Soundtrack by Stanton Site
3 Thumbs Up Documentary Site
Apple Trailers
New York Theater Quad Cinema

Every designer uses color differently, obviously some better than some. I’ll admit, choosing colors is not my strongest suit, but because of modern day apps and tools, I have a more confident and effective outlet for choosing colors on my projects. These tools also help me to experiment and try new things. Apps in general have streamlined my whole creative thought process. Let’s get to the good stuff. Below are a list of the color apps I use to extend my creativity. If you’re not already using these for your color palettes, ideas, and/or brainstorming process, then I suggest you get on board.

Kuler

You can visit Kuler Online or if you have, I believe CS3 on up, you can use the Kuler Extension under Windows/Extensions/Kuler within the Adobe Software.

Color Scheme Designer

Unlike Kuler being a Flash App, Color Scheme Designer is an amazing jquery app online that allows you to visualize how type will look on top of certain colors as well as pick awesome color palettes. You can check it out.

Here are two must buy iPhone apps for designing with color on the go.

Palettes

The Palettes app allows you to not only create color palettes, but also maintain and organize your palettes. What’s really cool is that wherever you go, you can create a palette on the fly whether its from a web site, a photograph, or one you might subconsciously or consciously develop.

CliqCliq Colors

CliqCliq Colors is another great iPhone app for generating color palettes. It has a different method of scaling color values than Palettes. Between these two apps, I’m set and have plenty of options on getting ideas for my next projects whether professional or personal.

Thanks. I hope you enjoyed this post. I would love to hear about your color stories, apps, extensions, and methods to developing awesome color schemes.

Finally, even Microsoft gets it. Even Microsoft wants you to stop using IE6 (especially) and IE7. I have to tip my hat to them and encourage Microsoft’s exposure to get this word out. If you like helping people then pass this on for each time someone downloads IE8 from this site, Microsoft will send out 8 meals to people in need. If someone upgrades from IE6 to IE8, then the donation will be doubled. It looks like even Microsoft has kicked dead browsers such as IE6 to the curb and so should you if you haven’t already. Make your life and my life easier. This site uses background PNGS! I am curious though to see if they even bothered fixing this for IE6, which at first glance I think they’ve moved on. This site is unable to load in IE netrenderer. I am probably preaching to the choir and at this point many of my recent clients have moved on, but for those that continue to use it then I will pass this site on in an attempt to feed the hungry and kill off IE6 for good.

View Site

Mozilla service week is coming up and you can help out. Bring the world together as the internet makes life better. Mozilla service week is a week set aside for designers, developers, and organizations to reach out and help make life easier through the internet. Whether you know how to design, teach someone how to set up a the internet, develop a promotional website, or whatever it may be involving computers, the internet, and people in need, Mozilla wants to know your stories and wants you to donate your hours if available to help those in need. Because of things like this, I can see Firefox being on top for some time to come if they continue these values and put people first.

Where have I been? Have I been working too hard to have missed this site and information on another Diablo game? Although release plans are not in sight based on the FAQ section of this site, I am so excited to get my hands on Diablo 3 when it does come out. It’s most likely going to be extremely hard to get a copy at first. I write this blog post in an effort to have all of you remind me and inform me on updates for Diablo 3. I might pay an arm and a leg.

Diablo 3 developers have plans for many new and exciting features. Many of which are listed on this site. Damn, how long has it been since Diablo 2 came out? This brings me back. Oh and this site may load a little sluggishly, but it is supreme I think. I love the ominous intro and slick flash implementation. Its not the most amazing site I’ve seen, but it is very cool and worth checking out for the site itself and the actual game of course.

Cheers!

View Site