It suddenly occurred to me last night, CSS should include a state machine.
In a subtle way, it already does with ":hover".
The hover state is triggered based on the mouse cursor's position. This very basic state allows designers to produce some interesting results.
Additionally, perhaps CSS should allow designers to create their own custom states. It could allow designers to assign state changes based on user interaction with page elements - such as onclicks. A page element could have unique CSS formatting depending on a given state. This concept provides a foundation to build highly interactive page elements without (or with less) javascript.
One application for this system is multi-paged documents. By hiding pages inside divs with both hidden and display states defined, a designer could build a menu that flips through any number of pages without requiring a new page load (a server request). Just think, a complete website could be stored in a single .html document.
State change interpolation is a potential subsequent addition to CSS. Pretend you used states to create a menu that window shades on double click. If you toggled between hidden and display states to change the menu, the animation is going to jump instantly from one state to the other. However, if you could interpolate the menu height from 100% to 0% between two states, you could create a smooth animation.
This would open the door to impressive interfaces, but without the use of Javascript.
Subscribe to:
Post Comments (Atom)
2 comments:
i see what you mean, it would lead to very interesting techniques...
but why reinvent the wheel? what you're suggesting is to merge javascript events with css.. my question is.. is that really necessary?
well, it's already been started by having :hover in CSS, so why not finish the job and reduce the need for javascript a bit further?
Post a Comment