Building an Awesome Navigation Menu with jQuery: Part 2

This is the second part of a two-part series that will help you build a complex sliding menu, enhanced with modal windows. Click here to read Part 1 of Building an Awesome Navigation Menu with jQuery

This second part will cover building a modal window and coding its behavior. If you don’t know what I already explained, please go back to the first article here and come back once you finish that one. However, if XHTML, CSS and jQuery are your friends, you may pick things up as we go, so just go ahead and read this part of the tutorial.

Let me remind you the concept we described in the previous article. We have a horizontal menu with a few categories. Each category has multiple subcategories and each such subcategory may contain a random number of products. For easier and faster movement of users thorough the site, we won’t reload the page once a subcategory is clicked. Instead, we will display all products in a modal window.

Here’s a screenshot of the menu and one simple modal window.

How does the modal work?

Read more

Building an Awesome Navigation Menu with jQuery: Part 1

Do you need to build a navigation interface that has to handle hundreds of product links? All grouped in categories, subcategories? Perhaps even containing thumbnails? If the answer is yes, here’s a usability path to avoid :

1. select categories, wait for a page to load
2. select a subcategory, wait for another page to load
3. check out products
4. click to go to desired product

The typical web user only wants to click once or twice to get to the product they want. And if clicks are unavoidable, make sure page loads are minimized! The more clicks and the more page loading they have to go through, the higher the risk they will get lost and never come back to your site. The good news is that you can achieve a good navigation menu that reduces page reloads.

This article is an in-depth tutorial on how you can achieve an expandable navigation menu using valid xhtml coding, valid css and a bit of javascript.
Read more

Service Review: XHTML.PixelCrayons.com

Timely and Quality PSD to XHTML Conversion Services

For every busy web designer and developer, there comes a moment when they want to kick the clock so hard that it stops time in its tracks. For our businesses, time is money; however, we cannot just stop taking on additional orders because we have too many- or do we? If your answer is often ”yes”, I’ll tell you something that might change your perspective for the better. Suppose, you have multiple web designs ready for coding, project submission dates are coming on quickly, and your inbox is brimming with yet more web design orders, what would you do?

Do you push back delivery dates?  That’s not so great for your client relations.  Do you divert all your resources toward timely delivery?  Clients are happy, but you increase your stress and can push back other high-priority tasks.  When situations like these happen, hiring a conversion company may be your best choice.

That’s where xhtml.pixelcrayons.com steps in with its PSD to XHTML conversion services.  According to its clientele, case studies, and my own test with them, you know exactly what you are getting, when you are getting it and how much it will cost. 

Read more