Zoom div on mouse hover using CSS

Last Reply one year ago By dharmendr

Posted one year ago

Dear Experts,

I need to know how to zoom Div containt with reflect text displaying on page. Can any one help me?


an example you can see here:


On hover zoom the div


Posted one year ago Modified on one year ago

Hi Mehram,

Check the below example.


<style type="text/css">
        -webkit-transform: scale(1.4);
        -moz-transform: scale(1.4);
        -ms-transform: scale(1.4);
        -o-transform: scale(1.4);
        transform: scale(1.4);
        background-color: #FCFAF0;
        width: 400px;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 10px;
        background-color: #EFF0F1;
<div align="center">
    <br />
    <div id="dvZoom" align="center">
        <a href="#">Displaying different JPEG formats in your browser</a>
        <br />
        <a href="#">Displaying different JPEG formats in Safari</a>
        <br />
        <a href="#">User Comments</a>