Answer Posted / fathimath thasneem
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Maximize Image Example</title>
<style>
.full-screen {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 9999;
}
#myImage {
width: 50%; /* Initially set to 50% of the container width */
cursor: pointer; /* Changes the cursor to a pointer to indicate it's clickable */
}
</style>
</head>
<body>
<img id="myImage" src="path_to_your_image.jpg" alt="Click to maximize">
<script>
const img = document.getElementById('myImage');
img.addEventListener('click', function() {
// Check if the image already has the full-screen class
if (img.classList.contains('full-screen')) {
img.classList.remove('full-screen'); // If yes, remove it (minimize)
} else {
img.classList.add('full-screen'); // Otherwise, add it (maximize)
}
});
</script>
</body>
</html>
| Is This Answer Correct ? | 0 Yes | 0 No |
Post New Answer View All Answers
what is the difference between the below two statements:- (1) var myname = "akiii"; (2) myname = "akiii";
What data types are supported in Javascript?
What does the following statement declares?
what is the difference between wrappers and primitives es: diff between int i=200 in primitives and integeri = new integer(54)
What is are the types of the pop up box es available in javascript?
Who is the world famous hacker?
How can javascript be used to improve the "look and feel" of a web site? By the same token, how can javascript be used to improve the user interface?
How do I open a .js file?
Is notepad ++ an ide?
What is createtextnode?
Is it possible to use javascript to change the meta-tags of the page?
What is a framework programming?
How do I use javascript to password-protect my web site?
How do I use an external javascript file?
Is javascript necessary?