Homework Six- Using Spry Dynamic Effects and Components

Begin with stroll.html from chapter 7. Add ALL three types of panels to one page. Upload all the necessary .js, .css files and hw5.html

Spry consists of HTML and CSS and custom Spry attributes. We have not introduced a set of custom tags that users must learn. This makes Spry easy to understand and build. With Widgets, we use standard HTML markup to build the widget structure. A small JavaScript call is used to pass an ID to Spry and it does the rest.

The Spry Team

2 pts. Extra Credit

Play the simulation: Adding Spry Effects

Create a single page called hw6ec.html with the following Spry Effects and link to it from this page.

Peachy on Sage Flowers

Tabbed Panels

  • Customization
  • Styles
  • Color
  • Width

Although the Property inspector enables you to make simple edits to a Tabbed Panels widget, it does not support customized styling tasks. You can alter the CSS rules for the Tabbed Panels widget and create a widget that is styled to your liking. For a more advanced list of styling tasks, see www.adobe.com/go/learn_dw_sprytabbedpanels_custom.

All CSS rules refer to the default rules located in the SpryTabbedPanels.css file. Dreamweaver saves the SpryTabbedPanels.css file in the SpryAssets folder of your site whenever you create a Spry Tabbed Panels widget. This file also contains useful commented information about various styles that apply to the widget.

 

Accordion Panels

Customize

lotus Although the Property inspector enables you to make simple edits to an Accordion widget, it does not support customized styling tasks. You can alter the CSS rules for the Accordion widget and create an accordion that is styled to your liking. All CSS rules refer to the default rules located in the SpryAccordion.css file. Dreamweaver saves the SpryAccordion.css file in the SpryAssets folder of your site whenever you create a Spry Accordion widget. This file also contains commented information about various styles that apply to the widget, so you might find it helpful to consult the file as well. For a more advanced list of styling tasks, go here

Text
Background Colors
Width

Collapsible Panels

Wine One
Wine Two
Wine Three
Wine Four

Peachy Sitting in Bouquet of Sage flowers...
and of course nibbling on them
Palms in a Palm Orchard
along the road in Costa Rica.
These are the palms that are used
to make Palm Oil