jQuery插件类似于《今日美国》的文章照片吗？ [关闭]

Question

我正在构建一个新闻网站（被要求提出新产品的设计），并决定利用这次机会作为一次向自己介绍JavaScript的机会。 我在这个部门的知识是基础知识，但是我一直在通过解构jQuery插件并尽可能多地学习来尝试jQuery插件。 话虽如此，我希望这不是一个愚蠢的问题，也不是我只是忽略的事情。

-

我正在寻求实现《今日美国》在其文章照片上具有的相同基本功能 ，该功能拍摄缩略图并在单击时调整图像的大小/展开。 在花了一些时间搜索jQuery插件之后，我发现唯一接近它的是jQuery.popeye，这是一个不错的开始，但并不是我想要的。 对于初学者，popeye不会调整图像大小，它从一个文件开始，并且在div扩展后，它链接到一个更大的新图像。 此外，按照popeye的构建方式，图像容器是静态的，并且需要固定的高度-对于新闻环境而言并不理想。

但是我继续将其添加到我的测试站点，以便我可以尝试将其分解并查看是否可以根据需要轻松地对其进行重建。 这就是我所拥有的 。

而不是尝试调试我所做的事情，我只是问是否有人知道那里是否有更好的插件？ 我可以学习尝试哪些核心功能并自行构建？ 或者，如果有人知道《今日美国》使用什么？

谢谢你的帮助。

Answer 1

无需推荐工具来执行此操作，您就可以自己做同样的事情，而无需花费太多精力。

如果您检查他们实际在做什么，这很简单，图像为完整尺寸（大版本），并且他们只是在调整div的大小。

所以：

<aside itemprop="associatedMedia" itemscope="" itemtype="http://schema.org/ImageObject" 
    class="single-photo expandable-collapsed" style="width: 180px;">
</aside>

简单地动画为：

<aside itemprop="associatedMedia" itemscope="" itemtype="http://schema.org/ImageObject" 
        class="single-photo expandable-collapsed" style="width: 540px;">
 </aside>

注意width属性在变化。

所以javascript就像下面这样简单：

$('#clickelement').click(function() {
    $('picture').animate({
    width: 500
  }, 5000);
});

并具有类似的功能，以再次将其缩小。