Created
April 27, 2020 14:21
-
-
Save deepak-glitch/a54dc7e547fbfb188d2998ab755e8cc0 to your computer and use it in GitHub Desktop.
cat generator-----gifs
This file contains 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
.flex-box-container | |
{ | |
padding: 10px; | |
display: flex; | |
flex-wrap: wrap; | |
justify-content: space-around; | |
border: 1px solid black; | |
} | |
.flex-box-container div | |
{ | |
padding-left: 100px; | |
} | |
.container | |
{ | |
width: 75%; | |
margin: 0 auto; | |
border: 2px solid black; | |
text-align: center; | |
} | |
.flex-box-container img | |
{ | |
border: 2px solid green; | |
} |
This file contains 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
function generatecat() | |
{ | |
var image=document.createElement('img'); | |
var div=document.getElementById("flex-cat-div"); | |
image.src="https://i.pinimg.com/originals/c3/2b/fa/c32bfa16bcf864e478d3ddfe32440268.gif" | |
div.appendChild(image); | |
} | |
function reset() | |
{ | |
window.location.href = "catgenerator.html"; | |
} |
This file contains 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
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"> | |
<link rel="stylesheet" href="cat.css"> | |
<title>Cat Generator</title> | |
</head> | |
<body> | |
<div class="container"> | |
<h2>TASK 2: CAT GENERATOR</h2> | |
<div class="flex-box-container"></div> | |
<p> </p> | |
<div> | |
<button class="btn btn-success" onclick="generatecat()">Generate cat</button> | |
<button class="btn btn-danger" onclick="reset()">reset</button> | |
</div> | |
</div> | |
<div class="flex-box-container" id="flex-cat-div"> | |
</div> | |
</div> | |
<script src="cat.js"></script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment