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 are all the looping structures in javascript?
How do you disable javascript?
why can't we call a static method from a non-static method
What is the === in javascript?
What is scope javascript?
What is difference between local and global scope in javascript ?
What is a name function in javascript & how to define it?
How to get an element by class in javascript ?
How do you check if a string is a number javascript?
Is javascript object oriented?
What is output of “20” + 20 + 20 and “20” + ( 20 + 20)? In javascript?
Are Attributes and Property the same?
How to get complete current page url with javascript?
What javascript means?
How to convert a string to a number using javascript?