Login | Register   
LinkedIn
Google+
Twitter
RSS Feed
Download our iPhone app
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX


advertisement
 

XML Applications : Page 2

Behaviors are an enhancement to Internet Explorer 5 that allow designers to add scripting elements without having to do the scripting needed to make them work. Behaviors are also a way in which scripters can write a script once and turn it over to designers for use whenever needed.


advertisement
Earthquake!

Earthquake!

This behavior falls into the realm of special effects. It's really not useful but it could help provoke mood on a Web site. To see it in action just run your mouse over the headline.

While it would probably be easy to implement this in the document directly we've chosen to use it as a behavior. Part of the beauty of behaviors is that they allow a designer to take pre-written code and effects and insert them into a Web page without having to be a programmer. By having effects like Earthquake available as behaviors a designer can build of an astonishing repetoire of Web display tools without needing to learn JavaScript.

Earthquake is set up via XML so you'll need to create an appropriate namespace before you can use it. We're doing it as XML so that older browsers aren't affected adversely. It also let's us define a brand new tag. The namespace is set up in the <html> tag on your Web page. Here's the one we're using on this page:


<html xmlns:fx>

The next step is to define XML tag we'll be using. This is done in the specific media type. In this case the behavior will apply to the screen so will place its CSS properties there and we associate it with our namespace by prefixing the namespace to the declaration. Our declaration looks like this:

<style> <!-- @media screen{ fx\:EARTHQUAKE { behavior:url(earthquake.htc) } } --> </style>

As you can see, the only part that is needed is the behavior property. It must point to the behavior file, earthquake.htc. You can download the earthquake.htc file here. Once you have it just make sure it's on your server and that the url is specified properly in your CSS.

All that's left then is to place the XML tags around the item you wish to trigger the earthquake behavior. Earthquake will be triggered when someone runs their mouse over the item. The tagging is very simple and looks like this:

<fx:EARTHQUAKE>Shake it, baby!</fx:EARTHQUAKE>

Now you've got it, everything you need to know to create your own earthquakes. So...uh....Shake it, baby!



Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap
Thanks for your registration, follow us on our social networks to keep up-to-date