सीएसएस के साथ होवर पर किसी तत्व को ज़ूम/स्केल करने के लिए, कोड इस प्रकार है -
उदाहरण
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1" /> <style> * { box-sizing: border-box; } .zoomDiv { padding: 50px; background-color: yellow; transition: transform 0.2s; width: 200px; height: 200px; margin: 70px; border-radius: 50%; border: 4px solid rgb(78, 37, 155); } .zoomDiv:hover { transform: scale(1.5); } </style> </head> <body> <h1>Zoom on Hover Example</h1> <h2>Hover over the below element to see it zoom.</h2> <div class="zoomDiv"></div> </body> </html>
आउटपुट
उपरोक्त कोड निम्न आउटपुट उत्पन्न करेगा -
पीले घेरे के ऊपर मंडराने पर -