Gallery Homework

Developer
Colleen Van Lent
Size
2,239 Kb
Views
42,504
  1. Gallery Homework Previews
  2. Gallery Homework HTML Codes
  3. Gallery Homework CSS Codes
  4. Gallery Homework JS Codes

How do I make an gallery homework?

What is a gallery homework? How do you make a gallery homework? This script and codes were developed by Colleen Van Lent on 26 August 2022, Friday.

Gallery Homework Previews
IQ Test

Gallery Homework - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Gallery Homework</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <hi>	<div id = "image">	Hover over an image below to display here.	</div>	<img class = "preview" alt = "Styling with a Bandana" src = "https://s3-us-west-2.amazonaws.com/s.cdpn.io/389177/bacon.jpg" onmouseover = "upDate(this)" onmouseleave = "unDo()";>	<img class = "preview" alt = "With My Boy" src = "https://s3-us-west-2.amazonaws.com/s.cdpn.io/389177/bacon2.JPG" onmouseover = "upDate(this)" onmouseleave = "unDo()";>	<img class = "preview" src = "https://s3-us-west-2.amazonaws.com/s.cdpn.io/389177/bacon3.jpg" alt = "Young Puppy" onmouseover = "upDate(this)" onmouseleave = "unDo()";> <script src="js/index.js"></script>
</body>
</html>

Gallery Homework - Script Codes CSS Codes

body{	margin: 2%;	border: 1px solid black;	background-color: #b3b3b3;
}
#image{ line-height:650px;	width: 575px; height: 650px;	border:5px solid black;	margin:0 auto; background-color: #8e68ff; background-image: url(''); background-repeat: no-repeat; color:#FFFFFF; text-align: center; background-size: 100%; margin-bottom:25px; font-size: 150%;
}
.preview{	width:10%;	margin-left:17%; border: 10px solid black;
}
img{	width:95%;
}

Gallery Homework - Script Codes JS Codes

function upDate(previewPic){ /* In this function you should 1) change the url for the background image of the div with the id = "image" to the source file of the preview image 2) Change the text of the div with the id = "image" to the alt text of the preview image */ document.getElementById('image').innerHTML = previewPic.alt;	}	function unDo(){ var pic = document.getElementById('image'); pic.style.backgroundImage = url('') pic.innerHTML ="HOVER" /* In this function you should 1) Update the url for the background image of the div with the id = "image" back to the orginal-image. You can use the css code to see what that original URL was 2) Change the text of the div with the id = "image" back to the original text. You can use the html code to see what that original text was */	}
Gallery Homework - Script Codes
Gallery Homework - Script Codes
Home Page Home
Developer Colleen Van Lent
Username ColleenEMc
Uploaded August 26, 2022
Rating 3
Size 2,239 Kb
Views 42,504
Do you need developer help for Gallery Homework?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Colleen Van Lent (ColleenEMc) Script Codes
Name
JS - Checkbox Example
JS - Gallery Homework
Consistent Browser styling - with prefixes
Document.write
Consistent Browser style - with default
JS Events - Modify The DOM
Teams.html
Code Together 3 No CSS - Classes
Index.html
Code Together 1 - With CSS
Create amazing captions with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!