Question

这就是我想要的。我希望当你点击按钮从300不透明度变为1不透明度300毫秒。问题是，当我点击按钮时，它没有动画！这太令人沮丧了。这是代码：

{{1}}

Answer 1

var Events = {}; var Backbone.Events = {};和0是数字而不是字符串。并且不是通过执行语句调用1。如果您打算这样做，则需要通过调用showStuff()内的showStuff();将其绑定到事件。

$(function () {});

您需要致电$(".ps").css("opacity", 0); var showStuff = function() { $("#div").click(function() { $("#phi").animate({ opacity: 1 }, 300, function() { $("#pname").animate({ opacity: 1 }, 300); }); }); }：

showStuff();

<强>段

＆＃13;

showStuff();

＆＃13;

$(".ps").css("opacity", 0);
var showStuff = function() {
  $("#div").click(function() {
    $("#phi").animate({
      opacity: 1
    }, 300, function() {
      $("#pname").animate({
        opacity: 1
      }, 300);
    });
  });
}
showStuff();

＆＃13;

#div {cursor: pointer;}
#phi {background: #99f; padding: 15px;}
#pname {background: #9f9; padding: 15px;}

＆＃13;

Answer 2

如果您正在使用jQuery，为什么不使用fadeIn（）和delay（）？

这是一个小提琴 - https://jsfiddle.net/xge2wnw7/

$("#div").click(function() {//dumbest id name for a div ever
    $("#phi").fadeIn(500);
    $("#pname").delay(1500).fadeIn(500);//wait a 1.5s and fade in the next element
});

Answer 3

如果您刚刚开始，您可能想要考虑保持模块化和内容，样式和功能分离是多么有用。在这种情况下，我不会在HTML中添加onClick。

HTML

pip install awsebcli --upgrade

的JavaScript

您有正确的想法将此函数存储在变量中。如果你有几个你想要这个功能的地方怎么办？您可以只编写一些参数并将其传递给函数，然后您可以定制每个函数调用不同的元素。另外 - 在您的codepen中 - 您不需要html中的<div class='message-block [ js-do-something ]'> <p class='greeting'>Hi!</p> <p class='message'>I'm Noah</p> </div>等。它已经包含在内。您的ID不必要地过于具体 - 在大多数情况下，您的课程会更好。另外 - 如果你想在视觉上分离专门用于功能的类 - 你可以在类前面添加js-或者甚至将它们放在括号中以确定。无论如何 - 这些是我对这个主题的看法。

<body> / <head>

jsFiddle

jQuery animate（）控制单击时的不透明度

3 个答案:

HTML

的JavaScript