I'm one of those people who completely reverted to server-side programming when confronted with the cross-browser compatability minefield in the late nineties. As part of the delusion, I convinced myself that browsers would eventually become fully object-oriented and that somehow justified my inertia. But over the past two years I have been stockpiling the JavaScript textbooks and had even started in on the basics... but let's face it, the JavaScript syntax, although flexible, is not the sexiest of creatures.

I recently introduced a JQuery menu into a website I am working on. Getting it working along with Visual Studio intellisense was a snap. It was only when I looked at the markup and the way that JQuery was interacting with the document elements that I experienced that well known "light goes on" moment.

JQuery used CSS3 (for the most part) selectors to reference the various document elements and totally abstracts away the browser incompatabilities of old. Wow! Now I blogged about JQuery before but my excitement then was mainly based on the VS intellisense available. I did not quite "get it". This library was the brainchild of John Resig and I'm now convinced that lowering the barrier to entry to this extent will bring a lot of creative server-side developers into the the RIA arena just when they are needed the most.

To get started, look at some of the basic tutorials and work through them. If you are using VS 2008 (or the Web Express version), then follow Scott Guthrie's steps for getting intellisense working in VS 2008; I installed the KB hotfix he mentions and dropped the vsdocs file into my js folder along with the JQuery library files and had no problems - very easy to do :-)

I came across a really slick menu on the Queness website and have adapted it to work with a regular ASP.NET master page. A download link to a working Web Application Project for this is provided below. The only thing I don't like is that the tab graphic has both the hover and non-hover images stacked one over the other in the same image. I would opt to change this by separating them out into separate files and update the CSS accordingly - examples of these menus are everywhere so you shouldn't have a problem with that. You can have it so that each menu tab will accomodate a text link with a different hover version. The key with this sample is making sure that the selectors in the markup match those referenced in the CSS and in the script.

Notes: JQuery Menu Sample with Master Page

  * 2.0 Web Application Project Template

  * Based on Queness menu but with 1.3.2 version of library and vsdocs added

  * CSS and markup have been tweaked to work with master page

  * Rounded corners have been commented out in markup as they looked pixelated - fixable

  * Change the hover background color for vertical links by altering script default of #888 

Resources

   * Check the original menu along with demo here.

   * Be sure to check out the JQuery UI Website!

   * What every developer should know about JQuery 

   * JQueryMenu.zip (115.39 kb)

CodersBarn launched in June 2007 and as you can see from the title, the original goal was to establish an "ASP.NET Community Blog". That is still the goal, side projects apart! But what does that mean? Despite the fact that the blog gets 7,000/8,000 hits a month, many from regular readers, I feel the need to explain the original purpose and provide some more detail on where it's headed.

We have seen much change in the industry in the last two years as the catch words of the day move from mash-ups and AJAX to RIA and Silverlight. The onslaught of new software and tools from Redmond has been unrelenting. This month I hope to be taking in the TechEd event in LA in attempt to familiarize myself with much needed SharePoint skills and to get a look at where we are headed with ASP.NET 4.0, C# 4.0 and VS 2010. The data access options are getting more confusing by the day, not to mention the introduction of the "cloud"...

Blogs are personal by nature and this one is no different in the sense that the articles posted are a reflection of the skills I am trying to develop and the hurdles encountered along the way. The "mission statement", for want of a better term, was not just to share working code samples, but also to incorporate good Web design and CSS into the everyday world of the ASP.NET Web developer.

With the introduction of Silverlight and the Expression suite of tools from Microsoft, the writing should be on the wall that if a developer (and I'm speaking of myself first and foremost) does not have client-side development skills in the shape of JavaScript/JQuery, then that developer will be unemployable in the RIA (Rich Internet Applications) era we are entering. But the biggest wake-up call of all is that developers are now expected to have basic design skills. Most developers I know can't draw a straight line so this is going to be interesting to watch. One thing is for sure, technological trends that have gained a certain momentum are unstoppable. RIA is one such seismic shift. If graphics, media and other things visual are a source of discomfort for you as a Web developer, then now would be a good time to re-skill in a different area of development.

Going forward, my personal skills acquisition list for the coming year involve some further study of the following, in no particular order:

   * JavScript/JQuery

   * Silverlight/AJAX

   * CSS

   * C# 3.0/4.0

   * Photoshop/Expression

A provisional to-do list for the CodersBarn blog currently includes:

   * New, wider layout

   * Creation and incorporation of my own design site

   * Use of video tutorials (like design a site in 15 mins flat)

   * Use graphics tablet to create sketches

   * A community forum

I may have to consider the use of subtitles with video tutorials for those who can't make out the Irish accent! Seriously, sometimes it's easier to actually do something than try and write about it, so Camtasia (check out Jing) is being added to the shopping list. You can expect more posts on ASP.NET and SharePoint, along with working code samples. However, more than anything else, the future direction of this blog will focus on the marriage of good CSS design and ASP.NET.

Resources:

  * Building ASP.NET 2.0 Web Sites Using Web Standards

  * Microsoft Design Center

  * Microsoft Expresssion

  * Microsoft Labs

  * MIX Online

As the World faces a swine flu pandemic, or gripa del marrano as they say in Mexico, one tries to keep one's sense of humor!