2

我正在处理应该像 这样在触摸时放大和缩小的图像。我使用了很多来自网络的例子,比如这个例子,我还使用了元标记视口。但我没有实现我需要的功能。我搜索了很多,但没有找到任何理想的解决方案。关于这个问题的任何帮助。

当时我正在使用元标记,但是当我双击图像时,图像变小了,并且没有到达原始位置。

    <meta name="viewport" 
            content="width=device-width, initial-scale=1.0,  maximum-scale=5.0, minimum-scale=0.25;, user-scalable=yes">

并且从网上我正在使用一个缩放的css和js文件,但它们的行为也一样

4

1 回答 1

0

那时我找到了解决这个问题的方法,即使用动画功能并增加高度、宽度或单独的高度或宽度来完成缩放。

这是我的代码,将在鼠标悬停时放大和缩小图像:

     <h1>Image to Zoom In and Zoom Out</h1>

     <br />

      <img src="http://1.bp.blogspot.com/-XSHj67HnEzU/TviX8Jqe-hI/AAAAAAAABRQ        /Io5Ob6bYWq0/s1600
      /ShadowEffect.jpg" alt="image zoom in and out" title="image zoom with  jquery" id="image1">
     </img>

在js中:

$(文档).ready(函数(){

   $('#image1').width(200);

   $('#image1').mouseover(function()

   {

      $(this).css("cursor","pointer");

      $(this).animate({width: "300px"}, 'slow');

   });


$('#image1').mouseout(function()

  {   

      $(this).animate({width: "200px"}, 'slow');


   });

});

于 2013-05-16T04:54:40.540 回答