Beware Mixing Purposes
CSS is intended to define the appearance of elements, not their behaviour. Be very careful about “overloading” CSS to accomplish tasks best performed by JavaScript.

A popular example of poor CSS usage is drop-down menu lists. Some web programmers use CSS’ :hover selector to instruct the web browser to display sub-navigation when the user hovers over a list item.

ul#menu li:hover ul { display: block; }


This is much better accomplished using a touch of jQuery:

jQuery("ul#menu ul").css({display: "none"}); // For Opera
jQuery("ul#menu li").hover(function(){
jQuery(this).find('ul:first').css({visibility: "visible", display: "none"}).show(268);
},function(){
jQuery(this).find('ul:first').css({visibility: "hidden"});
});

Not only is this example less dependent on consistent web browser support for the CSS :hover selector, we’ve even thrown in a spiffy little roll-out animation.

Keep It Simple
The nth-child selector is one that stands to be abused by overzealous developers. Imagine this: change the display of every n^th element as defined through an algebraic expression.

Why is this a bad thing? CSS is run in the same memory space as the general web page – that’s why it’s so fast. JavaScript tends to be isolated; meaning if you make an infinite loop in JavaScript, the web browser will eventually stop it from running. If the same thing happens in CSS, your web session is probably toast.

Separate Logic from Presentation
CSS was a leap forward because it separated presentation from structure; rather than programming font and colour elements, designers were able to explicitly control the way their web page appeared on screen. HTML was being used to serve the purpose CSS was designed to cover.

More recently, CSS has become a crutch to enable functionality better suited for JavaScript. When unsure about which to use, ask yourself: Does this solution affect only the display, or is some action happening?

Related posts:

1. BrowsrCamp – Test Web Designs on Mac

To resolve, click on the WAMP Server icon in the task tray, go to Apache -> Version -> Get More. Download one of the 2.0 series Apache servers and install it.

Repeat the process for PHP; download one of the 5.0 series PHP versions and install it.

Switch WAMP Server to the new versions and run the install again – it should work with no problems.

Related posts:

1. VISTA: How to fix SQL Server Express Error – CREATE DATABASE permission denied in database ‘master’

var myString:String = “15″;
var myNum:Number = Number( myString );

The framework will convert any data type, not just strings. If it is unable to do so, it will return 0 (for ints) or NaN (for floating point).

No related posts.

Wordpress is a terrific platform with out-of-the-box support for many of the critical elements necessary for site building: CSS layouts, RSS feeds, track backs. But the glaring problem with Wordpress is the default title format: “Blog Name > Blog Archive – Post Title”. What is that!?

Many search engines only catalogue the first several characters of web page titles. If the title of your post is at the end of the page title, it may get cut off in favour of your blog’s name!

The simple solution is to reverse the code as explained at the Wordpress garage (and quoted below for convenience):

You can switch it through the use of plugins, but if you want to avoid using another plugin you can fix this in the header.php file. Find the code that starts with <title>, and replace what is currently there with this:

<title><?php if ( is_single() ) { ?> <?php wp_title(''); ?> &raquo; <?php } ?><?php bloginfo('name'); ?></title>

Related posts:

1. A Simple Makefile for the Go Language

Recently I’ve taken up time creating applications with a trial version of Flex Builder.  This is the first time I have ever really given a product a full test drive during the trial – normally it gets used once or twice then forgotten about.  Flex Builder is a solid product, built on a great platform.  I can’t get enough of it.

Since I truly like this software, I decided to go ahead and plug in my credit card information to get myself a full copy.  When I got to the Adobe online store though, I was sadly let down by my experience.

I am in Canada but for some reason my existing account has ‘United States’ listed as my address.  Not a big deal, I’ll just change it, right?  No – it is not a changeable field.  You can change your region on the Adobe site but that doesn’t affect your account at all.  If I can’t change my country, I can’t order online because my credit card information will be wrong.

Not a big deal – I called the sales phone number and explained what my problem was, hoping to order the product by phone.  You can’t order software for download by phone, they will only ship it to you.  I’d much rather just have the serial number, so I am transferred to the online support department to get the country of my account changed.

Once I noticed my phone timer had reached 37 minutes, I hung up and tried searching the Internet for a solution to Adobe’s problem.  I found this blog: http://www.gurtle.com/ppov/2008/10/17/adobe-id-customer-service-fail/

Basically, you can’t change your country.  The only way to do it is to create a new account with the correct country.  It would have been nice if the gentleman in sales had known to tell me that instead of letting me wait on hold for an indefinite period of time.

Really, the reason I am most angry is because the muzak that plays on Adobe’s hold line is not just obnoxious, it’s too loud.  Right now my head is ringing and I still have no Flex Builder to play with.

No related posts.

If you need to, for example, attach a MOUSE_MOVE event to the application stage from a component that doesn’t include a creationComplete override, you have two options.

Wait for Event.ADDED_TO_STAGE

addEventListener( Event.ADDED_TO_STAGE, function(e:Event):void
{
stage.addEventListener( MouseEvent.MOUSE_MOVE, myMouseMoveEvent );
});

Attach Through the System Manager Object

The system manager parents all displayable elements within the Flex application. It is an elegant way of accessing the stage through custom flex components which have not yet been added to it.

systemManager.stage.addEventListener( MouseEvent.MOUSE_MOVE, myMouseMoveEvent );

No related posts.

Use iisreset to quickly get back up and running.

In order to prevent this from occurring at all, I recommend putting try { } catch { } around any statements inside a threaded function.

No related posts.

Solution: Changed the class inheritance from WebControl to CompositeControl.  Re-compiled and it worked like a charm.

No related posts.

Adobe FlexBuilder 3 provides an integrated development environment (Eclipse, actually) that allows programmers to build Flash applications. I was pleasantly surprised to discover this software, and found its brand of MXML to be very familiar coming from an ASP.NET background.

Stay tuned for updates as I learn more about this software. Have you had any experience with it? I welcome comments and suggestions – what should we watch for when working with this software?

No related posts.

One day last year my client decided we needed to incorporate AJAX into their web site. AJAX was considered the big thing, and by not having “it” we were going to fall behind some of our competitors.

“What do you want to enhance using AJAX?”
“What do you mean? Just install AJAX.”

Ok. I’ve been doing a lot of work with JavaScript for years, including DOM manipulation and other Web 2.0-ish type trickery, but AJAX as a concept was something I had yet to explore. After reading resources available online, I decided to jump ahead a bit and buy a book on the topic.

I picked JavaScript & Ajax, Visual Quickstart Guide for a number of reasons.

1. It featured a beginner’s look at AJAX
2. It is part of the Visual Quickstart series – anyone who knows me will know that I love how professionally this series is put together
3. It features a full-colour DOM object reference flowchart

I will admit this book is not the most comprehensive resource out there, for JavaScript or for AJAX. If I had wanted a more solid reference manual I would likely have sought out a book that focused solely on AJAX or solely on JavaScript. My trusty old tome Mastering JavaScript has always been a great reference, and I won’t get rid of it any time soon.

Although the title of the book is JavaScript & AJAX, the truth is this is a book about JavaScript. Right in the introduction the authors admit they simply added Ajax in this (6th) edition. Beginning the chapter on Ajax, we learn that the name of the book was changed to include Ajax in order to cash in on the success of the methodology. I won’t fault the authors for making that move – in fact I would consider a book about JavaScript to be incomplete nowadays if it did not include a discussion on Ajax.

I bought this book because of its practical discussion. The authors describe generic tricks such as adding dynamic dates and form validation to your site, something older books don’t always consider in much detail. Although the language itself hasn’t really changed since the 90s, the way we use it has. For that reason alone I like to upgrade my bookshelf to keep up with the current trends.

This book features a full colour reference chart for DOM properties. This may not be useful to people who like to use syntax-highlight and code completion software, but I still tend to write JavaScript in plain text editors, so any attribute I don’t know off the top of my head is handy to have at my fingertips.

In all, the authors have done a good job of bringing together a thorough primer for JavaScript. The book identifies itself as targeting beginner to intermediate programmers, an assessment I would tend to agree with. If you’re looking for a decent reference, easy to access, without a lot of jargon, this is the book for you.

No related posts.