Created
May 5, 2017 15:24
-
-
Save joliz/1d5b42199e2c4787c8c6db49931dfea7 to your computer and use it in GitHub Desktop.
Exported from Popcode. Click to import: https://popcode.org/?gist=1d5b42199e2c4787c8c6db49931dfea7
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Page Title</title> | |
</head> | |
<body> | |
<h1> Attention: Program Managers </h1> | |
<p> The great villian Ultron has stolen the ScriptEd curriculum and is holiding all our volunteers hostage. He sees diversity in the technology industry as a threat to all his evil plans. You must use a For Loop and an array to assemble the Avengers and put an end to his evil plan.</p> | |
<button> Assemble Avengers</button> | |
<img src="https://www.sideshowtoy.com/wp-content/uploads/2015/02/902343-product-silo.png"> | |
<div id="avengers"> </div> | |
</body> | |
</html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{"enabledLibraries":["jquery"]} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//Hulk Image: https://upload.wikimedia.org/wikipedia/en/5/59/Hulk_%28comics_character%29.png | |
//Thor: http://vignette1.wikia.nocookie.net/disney/images/4/44/AoU_Thor_02.png/revision/latest?cb=20150310161346 | |
//Ironman: https://vignette2.wikia.nocookie.net/ironman/images/9/96/Iron-Man-AOU-Render.png/revision/latest?cb=20150306195832 | |
//Captain America: https://static1.comicvine.com/uploads/original/11/113509/5117288-8538041188-EOSkE.png | |
//Black Widow:http://orig05.deviantart.net/a621/f/2016/100/1/6/black_widow___transparent_by_asthonx1-d9suzsa.png | |
var Avengers = ["https://upload.wikimedia.org/wikipedia/en/5/59/Hulk_%28comics_character%29.png", "http://vignette1.wikia.nocookie.net/disney/images/4/44/AoU_Thor_02.png/revision/latest?cb=20150310161346","https://vignette2.wikia.nocookie.net/ironman/images/9/96/Iron-Man-AOU-Render.png/revision/latest?cb=20150306195832", "https://static1.comicvine.com/uploads/original/11/113509/5117288-8538041188-EOSkE.png", "http://orig05.deviantart.net/a621/f/2016/100/1/6/black_widow___transparent_by_asthonx1-d9suzsa.png"]; | |
$("button").click(function(){ | |
for (var i =0; i < Avengers.length; i= i+1){ | |
$("#avengers").append('<img src='+Avengers[i]+'>'); | |
} | |
}); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
h1{ | |
color:red; | |
text-align:center; | |
border-style: solid; | |
border-color: red; | |
border-radius: 20px; | |
animation-name: flash; | |
animation-duration: 0.9s; | |
animation-timing-function: linear; | |
animation-iteration-count: infinite; | |
animation-direction: alternate; | |
animation-play-state: running; | |
} | |
@keyframes flash { | |
from {color: red;} | |
to {color: black;} | |
} | |
p{ | |
color:white; | |
text-align:center; | |
} | |
button{ | |
color:black; | |
text-align:center; | |
margin-left:43%; | |
font-weight:bold; | |
border-style: solid; | |
border-color: black; | |
border-radius: 20px; | |
animation-name: flashy; | |
animation-duration: 0.9s; | |
animation-timing-function: linear; | |
animation-iteration-count: infinite; | |
animation-direction: alternate; | |
animation-play-state: running; | |
} | |
@keyframes flashy { | |
from {color: green;} | |
to {color: black;} | |
} | |
img{ | |
width:15%; | |
height:15%; | |
float:right; | |
} | |
body{ | |
background-color:black; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment