如何在c#或asp.net中使用两个按钮放大和缩小图像?不使用jquery。 [英] how to zoom in and zoom out an image using two buttons for them in c# or in asp.net? Without using jquery.

查看:121
本文介绍了如何在c#或asp.net中使用两个按钮放大和缩小图像?不使用jquery。的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何在c#或asp.net中使用两个按钮放大和缩小图像?

不使用jquery。

how to zoom in and zoom out an image using two buttons for them in c# or in asp.net?
without using jquery.

推荐答案

您好,

在您的页面上添加代码

Hello,
Add the Code on Your Page
// Add Style in Head Section 
<style type="text/css">
        #imagediv {
            margin: 0 auto;
            height: 400px;
            width: 400px;
            overflow: hidden;
        }

        img {
            position: relative;
            left: 50%;
            top: 50%;
        }
    </style>

// Add the Script,Image & Button Inside Body 
<body>
 <form id="form1" runat="server">
        <input type="button" value="-" onclick="zoom(0.9)" />
        <input type="button" value="+" onclick="zoom(1.1)" />
        <div id="imagediv">
            <img id="pic" src="images/22.jpg" />
        </div>
        <script type="text/javascript" language="javascript">
            window.onload = function () { zoom(1) }
            function zoom(zm) {
                img = document.getElementById("pic")
                wid = img.width
                ht = img.height
                img.style.width = (wid * zm) + "px"
                img.style.height = (ht * zm) + "px"
                img.style.marginLeft = -(img.width / 2) + "px";
                img.style.marginTop = -(img.height / 2) + "px";
            }
        </script>
    </form>
<body>


这篇关于如何在c#或asp.net中使用两个按钮放大和缩小图像?不使用jquery。的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆