Question

我正在处理一个项目，我希望对页面上的元素有一种淡入淡出效果，如果页面加载这些元素，则会带有淡入效果。我在jquery中尝试了一些非常简单的东西，比如$("#showEffect").show(1000);，但这不起作用。如何将这些效果添加到我的元素中？

Answer 1

为了首先显示元素，你必须隐藏它。

WHERE column LIKE :path || '%'

这可以解决您的问题。

Answer 2

试试这个：

您还可以通过更改毫秒来更改时间限制，因为我放置了import "object_detection/protos/grid_anchor_generator.proto";

Answer 3

我个人会在CSS中使用display: none。

用JavaScript显示它

$(this).fadeIn("fast");

在慢速设备上，如果您使用.hide()，它仍然会在短时间内显示该元素，因为JavaScript并不快。它依赖于您的设备/浏览器的性能，因此最好坚持使用display: none。

Answer 4

如果您想在此基础上构建并在某个时刻拥有更复杂的动画，toggleClass可能值得研究;这将在元素上切换一个css类，这样你就可以在渐变时添加类似尺寸的东西：

$('#element').toggleClass('my-class');

一个缩小和淡化元素的css类：

.my-class {
  transform: scale(0.5);
  opacity: 0.0;
  transition: 100ms all;
}

您可能希望在transition: 100ms all的css中包含#element，以便在关闭类并且元素淡入时动画是平滑的。

Answer 5

如果您不想使用任何课程或任何自定义CSS方法，您可以尝试这样做。

此示例假设您的元素未处于隐藏状态，因此当页面加载完成后它将被js隐藏，然后淡入将其带入图片..：D 希望它有所帮助..

＆＃13;

$('document').ready(function(){
  $('#div1').toggle().fadeIn(2000);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div1" style="background:red;height:200px;width:200px"></div>

＆＃13;

页面上的Jquery元素加载效果

5 个答案: