Zoom div on mouse hover using CSS

Last Reply 29 days ago By dharmendr

Posted 29 days ago

Dear Experts,

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

VB.aspx

an example you can see here:

https://www.the-art-of-web.com/html/jpeg-formats/

On hover zoom the div

https://www.the-art-of-web.com/html/jpeg-formats/

Posted 29 days ago Modified on 29 days ago

Hi Mehram,

Check the below example.

HTML

<style type="text/css">
    #dvZoom:hover
    {
        -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;
    }
    #dvZoom
    {
        width: 400px;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 10px;
        background-color: #EFF0F1;
    }
</style>
<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>
    </div>
</div>

Demo

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html