Archive for the ‘ CSS ’ Category

What is jTipster? Remember the times you would like to add notes to a picture, but there were no other ways to do it without firing up Photoshop. The problem with that is the content added to the picture was not easily changed, you needed some Photoshop skills and well, not SEO friendly.

So, what is it again? Well, jTipster allows you to add “markers” to a picture. For each marker added, you can add short or long captions that appear on rollover. See it working here.

So, how do you get it working. Follow the steps below and to get started.

There has been some talk recently about frameworks. Some for, some against and some on the fence. As someone who has not tried her hand at a single established framework, I have to say I am rather ambivalent about them. When I first read about the first CSS framework, my initial thoughts bordered on the negative. I was constantly arguing in my mind about the extra bloated code. Then my mind raced to the unsemantic code. And it went on and on …

There would be times you would want to offer your users an indication of the current form element they are on. A simple, non intrusive manner for this would be as simple as changing the background of the element using CSS. Users who are using their keyboard to move through the form elements would also benefit from this as this provides a more obvious cursor position.

A while back, while working on an intranet that displayed the amount of cash flow, we (design team) had to come up with a way to show data graphically. As the graphs we wanted were rather simple bar charts, we did not want to expend too much energy in researching extra tools in achieving this goal. With a little creative trick using absolute positioning, out came the bar chart with negative axis. Check out the code below to create the effect.