The next several exercises are timed. If you type slowly or dislike time pressure, feel free to increase the allotted time.
Name and email required. Check any number of boxes.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19
0
0
0
| Fill in the blank to animate the div into off to the left of the screen when the mouse leaves it. The div is 300 pixels in width. | $("div#tab_mail_full").on("_________", function() { $("this").animate({left: "-300px"},"fast"); }); | mouseleave | ^ *mouseleave *$ |
| Fill in the blank to animate the div into off to the left of the screen when the mouse leaves it. The div is 300 pixels in width. | $("div#tab_mail_full").on ("mouseleave", function() { $("this")_________ ({left: "-300px"}, "fast"); }); | .animate | ^ *\.animate *$ |
| Fill in the blank to animate the div into off to the left of the screen when the mouse leaves it. The div is 300 pixels in width. | $("div#tab_mail_full").on ("mouseleave", function() { $("this").animate({left: _______}, "fast"); }); | "-300px" | ^ *•-300px• *$ |
| Fill in the blank to animate the div into off to the left of the screen when the mouse leaves it. Animate at fast speed. The div is 300 pixels in width. | $("div#tab_mail_full").on ("mouseleave", function() { $("this").animate({left: "-300px"}, ______); }); | "fast" | ^ *•fast• *$ |
| 5. Drag-and-drop: Holding down the left mouse button, drag the pieces of code onto the screen to animate the div into off to the left of the screen when the mouse leaves it--slow. | $(this).animate({left: "-300px"}, "slow"); | ||
| Code the line that animates $(this) off to the left so it's invisible. The div is 450 pixels wide. Omit the speed. Don't bother to indent. | $(this).animate({left: "-450px"}); | $(this)`.`animate`(`{`left`:`1space"`-`450`px`"`}`)`; | |
| Code the line that animates $(this) off to the left so it's invisible. The div is 450 pixels wide. Omit the speed. Don't bother to indent. | $(this).animate({left: "-450px"}); | ||
| Code the first line that animates a div when the mouse leaves it. Make up the div's id. | $("div#tab").on("mouseleave", function() { | ^ *\$\(•div#.+•\)\.on\(•mouseleave•, function\(\) { *$ | |
| Code the line that animates a div off to the left so it's invisible. The div is 500 pixels wide. Make up the div's id. Omit the speed. Don't bother to indent. | $("div#full").animate({left: "-500px"}); | ^ *\$\(•div#.+•\)\.animate\({left: •-500px•}\); *$ | |
| Code the line that animates all images off to the left. The widest image is 250 pixels wide. Make the animation happen in your choice of seconds. Don't bother to indent. | $("img").animate({left: "-250px"}, 5000); | ^ *\$\(•img•\)\.animate\({left: •-250px•}, [0-9]*\); *$ | |
| Code the first two lines that animate a div off to the left when it's invisible. Don't specify a speed. Make up the id of the div and the div's width. Indent the second line. | $("div#mail").on("mouseleave", function() { $(this).animate({left: "-300px"}); | ^ *\$\(•div#.+•\)\.on\(•mouseleave•, function\(\) {\n *\$\(this\)\.animate\({left: •-[0-9]+px•}\); *$ | |
| Code three lines that animate a div when the mouse leaves it. The div is moved off to the left of the screen to it's invisible. The div is 400 pixels wide. Specify a speed (your choice) using a word rather than a number. Make up the id of the div. Indent the second line. | $("div#mail").on("mouseleave", function() { $(this).animate({left: "-400px"}, "fast"); }); | ^ *\$\(•div#.+•\)\.on\(•mouseleave•, function\(\) {\n *\$\(this\)\.animate\({left: •-400px•}, •(fast|slow)•\);\n}\); *$ | |
| Code the line that animates $(this) off to the left so it's invisible. The div is 450 pixels wide. Omit the speed. Don't bother to indent. | $(this).animate({left: "-450px"}); | ^ *\$\(this\)\.animate\({left: •-450px•}\); *$ | |
| Code the first line that animates a div when the mouse leaves it. Make up the div's id. | $("div#tab").on("mouseleave", function() { | ^ *\$\(•div#.+•\)\.on\(•mouseleave•, function\(\) { *$ | |
| Code the line that animates a div off to the left so it's invisible. The div is 500 pixels wide. Make up the div's id. Omit the speed. Don't bother to indent. | $("div#full").animate({left: "-500px"}); | ^ *\$\(•div#.+•\)\.animate\({left: •-500px•}\); *$ | |
| Code the line that animates all images off to the left. The widest image is 250 pixels wide. Make the animation happen in your choice of seconds. Don't bother to indent. | $("img").animate({left: "-250px"}, 5000); | ^ *\$\(•img•\)\.animate\({left: •-250px•}, [0-9]*\); *$ | |
| Code the first two lines that animate a div off to the left when it's invisible. Don't specify a speed. Make up the id of the div and the div's width. Indent the second line. | $("div#mail").on("mouseleave", function() { $(this).animate({left: "-300px"}); | ^ *\$\(•div#.+•\)\.on\(•mouseleave•, function\(\) {\n *\$\(this\)\.animate\({left: •-[0-9]+px•}\); *$ | |
| Code three lines that animate a div when the mouse leaves it. The div is moved off to the left of the screen to it's invisible. The div is 400 pixels wide. Specify a speed (your choice) using a word rather than a number. Make up the id of the div. Indent the second line. | $("div#mail").on("mouseleave", function() { $(this).animate({left: "-400px"}, "fast"); }); | ^ *\$\(•div#.+•\)\.on\(•mouseleave•, function\(\) {\n *\$\(this\)\.animate\({left: •-400px•}, •(fast|slow)•\);\n}\); *$ | |
| http://jsfiddle.net/ASmarterWayToLearn/qrahkfc4/ | |||
| http://jsfiddle.net/ASmarterWayToLearn/hkgbchp9/ |