可以动画吗？

是否有可能在jQuery中动画.attr函数？我有一个基于点击改变视频宽度和高度的iframe。我必须使用.attr来更改iframe的宽度和高度，因为我有使iframe响应屏幕浏览器的css代码。可以动画吗？

<iframe id="video-ply" src="<?php echo get_post_meta(get_the_ID(), 'video_embed_url', true) ;?>" frameborder="0" allowfullscreen="true" scrolling="no" width="615" height="346"></iframe>

的jQuery：

$("#video-ply").attr('width', '889px'); 
$("#video-ply").attr('height', '500px');

来源

2017-10-19 Gregory Schultz

我想，而不是使用.attr尝试改变班级的iframe的，

$（ “＃视频层”）addClass（ “动画”）。

然后在你的CSS文件，

创建一个名为类.animate

.animate{ 
    width: value; 
    height: value; 
    /* css transition effects here */ 
}

来源

2017-10-19 03:58:27 apelidoko

你可以只通过CSS应用的过渡。然后，当它改变高度/宽度，将在转速过渡你想要的，而不是瞬间：

JS Fiddle

#video-ply { 
    transition: 1s; 
}

如果需要，您也可以单独控制每个属性的速度，延迟和过渡类型：

JS Fiddle

#video-ply { 
    transition: height 2s .4s ease, width .5s 1s ease; 
}

此外，你可以使用jQuery的.height()和.width()而不是使用.attr()并把它们连，以及：

JS Fiddle

$("#video-ply").height('200px').width('200px');

或者使用.css()：

JS Fiddle

$("#video-ply").css({ 
    'height': '200px', 
    'width': '200px' 
});

或者直接切换一个新的课程类，并有一个样式表为你做一切。

来源

2017-10-19 03:54:53

可以动画吗？

回答

相关问题