Archive for the ‘JavaScript/CSS’ Category
Flex Regular Expression Online Testing / Learning Tool
When it comes to Regular Expressions, I start feeling giddy. Even after using them a lot on many projects, I never remember the qualifiers and syntax. It’s always RTFM for me when I need to use some regular expressions in my code.
And that happened again today. I looked around the manual and searched online for a “quick fix” on the regular expression I needed. And I found a very interesting online Regular Expression trial / demo / learn by exploring tool. It’s made in Flex (and I needed RegExp for Flex) and helped me develop the RegExp I needed in a couple of minutes. (ok, I am still slow, but I found it!)
Thank you Remus Stratulat for creating this useful tool! BTW, he also has a similar tool for JavaScript Regular Expressions.
Click on the image below or here and jump to online regular expression checking tool.
Coding Clean and Semantic Templates
If you are the guy who uses<div> tag for everything, this post is for you. It focuses on how you can write clean HTML code by using semantic markups and minimize the use of <div> tag. Have you ever edited someone’s templates, don’t those messy tags drive you crazy? Not only writing clean templates can benefit yourself, but your team as well. It will save you time when you have to debug and edit (particularly the large projects).
This post is a collection of some simple yet effective techniques. Read all tips over on Web Designer Wall.
Scrolling with mouse wheel in Flex application – even on Mac
By default Flex components do not scroll as you scroll using the wheel on your mouse. You can achieve this by writing a mouseWheel event handler, checked the delta value and scrolling up or down depending on whether it’s positive or negative.
But that does not work on Mac OS X.
The solution involves tracking mouse move events at browser level using JavaScript, and passing them to Flex. A handler in Flex will then scroll the application / component as you specify.
It works well! Except that you can only scroll one way – either vertically (as in the code above) or horizontally (by hacking the code above!)
Wish Flex supports this by default someday! Would really help!
What do you think? Do you use mouse wheel / track pad to scroll?
Mobile AJAX
It’s hot these days! Mobile AJAX!
W3C/OpenAjax Workshop on Mobile Ajax happened yesterday, and there is some interesting reading in the papers.
If you are new to Mobile AJAX, dev.mobi’s got a very well written introductory article.
CSS Optimizer
Ashok S, our designer sent this:
If you want to optimize your CSS code, checkout the CSS Optimizer on flumpcakes. It is an online tool which helps you delete unwanted css code.
From their about page, the tool essentially does the following:
- Removes comments
- Removes white space (such as excess spaces)
- Converts RGB values to Hex (they’re smaller)
- Converts Hex values in the format #RRBBGG to #RGB.
- Changes zero values with a size specified to 0. (0px would change to 0)
- Changes values such as
border: 1px 2px 1px 2px;toborder: 1px 2px; - Converts multiple background, font, margin, padding, list attributes into a single attribute
- Converts multiple border values into single attributes
- Option to convert absolute values (PX & PT) into relative values (EM)
- Groups style attributes and values which appear multiple times into a single style

