Presentation is loading. Please wait.

Presentation is loading. Please wait.

Advanced DHTML, Dynamic CSS

Similar presentations


Presentation on theme: "Advanced DHTML, Dynamic CSS"— Presentation transcript:

1 Advanced DHTML, Dynamic CSS
Chapters 17, 18

2 Animating an object Take a look at script to move an object from corner to corner You should have the basic idea from the tractor script shown earlier

3 Other actions Move in a circle Follow the pointer Draggable objects
Simple popup windows (this could be useful); these are also behaviors in Dreamweaver. Move window Resize it

4 Changing Styles There is one example here in Chapter 18 that changes text size. Note Object.style[stylename] = newVal There is another in Chapter 24. You will need to adopt one or the other. Other options here are reading styles from the sheet, and changing classes. A more complete switcher changes the whole style sheet (also consider <link type="text/css" rel="alternate stylesheet" href="other.css"/> which still must be called in the page)

5 Using alternate stylesheets
Here's a script from alistapart.com that makes sure that other stylesheets are disabled, and that stores the style's status in a cookie styleswitcher.js Create alternate stylesheets with titles (no title for the original stylesheet) <link rel="alternate stylesheet" title="fred" href="fred.css"/> Connect to the script below the stylesheets <script type="text/javascript" src="styleswitcher.js"></script> Add event handlers <a href="#" onclick="setActiveStyleSheet ('fred'); return false;">Choose Fred</a> The original article is here.


Download ppt "Advanced DHTML, Dynamic CSS"

Similar presentations


Ads by Google