0

在一个网站上，我有一个提到某件事的新闻文章列表。我希望文章能够被按下，当它们被按下时，图像源会与实际文章的图像源切换，并且图像会增长到任意大小。当您再次单击图像时，它应该会恢复正常。我还希望它将自己设置为绝对定位，或者在它增长时不会将元素推开的方式。

我想我的第一个问题是，是否已经有代码片段或简单的实现或类似的东西？我一直找不到。

其次，我正在制作我自己的，无论出于何种原因，当页面加载时，每张图片都会在没有任何东西被按下的情况下逐渐消失。到目前为止，这是我的代码...

$(".newsCover").toggle(function () {

$(this).animate({
    width: "auto",
    height: "1000px"
}, 1500);

}, function () {
    $(this).animate({
        width: "auto",
        height: "300px"
    }, 1500);

});

谁能告诉我它有什么问题以及如何解决它？我有一种感觉，它只是一个非常愚蠢的东西......

非常感谢！

4

2 回答 2

0

您使用的切换功能在 1.8 中已弃用，并在 1.9 中删除，请参见此处：http : //api.jquery.com/toggle-event/ 在 v 1.9+ 中，切换功能现在只是隐藏元素。

没有参数，.toggle() 方法只是简单地切换元素的可见性

可以在此处找到可以传递给新切换函数的参数：http: //api.jquery.com/toggle/使用新切换函数，您无法在.animate()其中运行该函数。为了实现您想要做的事情，您可以执行以下操作：

$(".newsCover").click(function() {
    if($(this).height() > 300) {
        $(this).animate({
             width: "auto",
             height: "1000px"
        }, 1500);
    }
    else {
        $(this).animate({
            width: "auto",
            height: "300px"
        }, 1500);
    }
});
于 2013-06-07T18:46:07.770 回答
0

.animate() 方法允许我们在任何数字 CSS 属性上创建动画效果。

所有动画属性都应动画为单个数值，除非以下说明；

http://api.jquery.com/animate/

但是，您可以通过将自动高度/宽度确定为硬数字来破解它：

JavaScript jQuery 动画到自动高度

于 2013-06-07T18:29:51.810 回答