增加点击图片的大小答案

【问题标题】：Increase size of image of click增加点击图片的大小
【发布时间】：2009-08-20 00:04:23
【问题描述】：

如果你看图片就很容易明白我的意思，如果你再次点击它，我也需要缩小它，它也需要动画：

The image link http://www.keironlowecreative.x10hosting.com/Help.png

【问题讨论】：

我不知道发生了什么，反正现在链接还在
你想要动画吗？如果是这样，您可以为此自定义 $.animate 命令。
是的，我希望它是动画的，但我对 jQuery 了解不多

【解决方案1】：

jquery

$(document).ready(function(){        
   $("#what > img").click(function () {
      $("img").toggle("slow");
   });    
});

html

<div id="what">
  <img src="small_img" />
  <img src="big_img" style="display: none" />
</div>

toggle

【讨论】：

这有点正确，只是我需要将其设置为动画，并且当我单击它时，徽标图像消失
顺便说一句，我并不是说我不会让徽标消失，我的意思是它确实会消失
toggle("slow") 应该有动画效果，请查看链接中提供的示例。第一个消失，第二个出现，这不是问题所在吗？小图切换大图。
是这样的，和我之前解释的不同，但还是不能正常工作keironlowecreative.x10hosting.com
哦，顺便说一句，我把它们从图像更改为 div，图像作为背景图像

【解决方案2】：

您可以为此使用horizontal accordion 插件之一。

【讨论】：

【解决方案3】：

请原谅内联样式...像素不准确。使用相同的图像两次，一个 div 放在另一个之上：

<div id="wrapper" style="position:relative; height:20px;">
  <div id="top" style="background:url(...) top left no-repeat; position:absolute; height: 20px; width:18px; top:0; left:0; z-index:2;"></div>
  <div id="under" style="background:url(...) top right no-repeat; position:absolute; height:20px; width:20px; top:0; left:2px; z-index:1;"></div>
</div>

所以顶部 div 显示加号和左角。底部 div 显示右上角 - 超过两个像素，因此它没有显示在顶部元素的角下。如果图像不透明，这没关系...

动画下div的宽度以获得效果。没有褪色，只有一张图像。应该是小而快的动画。

【讨论】：

我无法让它工作，我在css中输入了样式，但它不起作用。