CSS event:Selectors

Justin Palmer has created a wonderful JavaScript snippet named CSS event:Selectors that allows you to allow you access to Javascript events using a CSS style syntax. If you work at all with JavaScript you’ll probably love this little hack as much as I do.

Here is a quick example of what Palmer is up to:

 var Rules = { '#icons a:mouseover': function(element) { element.style.display = "none"; }, '#icons a:mouseout': function(element) { element.style.display = "block"; } } 

Pretty sweet!  The article is very short and explains everything you need to know to implement event:Selectors with applicable code snippets as well, and includes links to view examples, documentation and to download event:Selectors.

From PSD to CSS

There is a nice tutorial at the Erratic Wisdom blog that will show you how to take your PSD website mockup and coding it into a standards based layout. This is a well-written, four-part tutorial that ironically begins by the author advocating taking a pencil and physically marking up the basic design composition.

I would pass this along to any students of web design who are making use of Dreamweaver and CSS because he starts by assuming virtually no PSD or CSS web design knowledge at all. If you need a refresher go take a look at this article and bookmark it for future reference.