MooTools Tests
Click the heading above!
When you click the heading above, the blockquote below the ordered list will animate. Prototype/Scriptaculous seems to have a problem with setting the margin when animating, while jQuery seems to have a problem with setting the background color when animating. To see the results when using Prototype/Scriptaculous or jQuery.
In addition, every other list item in both the ordered list and the unordered list should be highlighted with a yellow back ground, view source to see how this was accomplished.
Header Level 2
- View this page using Prototype/Scriptaculous
- View this page using jQuery
- Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
- Aliquam tincidunt mauris eu risus.
- Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
This is the blockquote (
<blockquote>) that should be animated by clicking the h1 (<h1>) at the top of the page. It should shrink in width to 400px, get a gray background (#CCCCCC), padding set to 25px and shift to the left by 125px (margin: 0px 0px 0px 125px;). jQuery doesn't support animating the background color.
Header Level 3
- Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
- Aliquam tincidunt mauris eu risus.
- Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
In the form below, the value of the first form input should be appended to the legend.
#header h1 a {
display: block;
width: 300px;
height: 80px;
}