Javascript Codepen与Jsfiddle——为什么只有其中一个能与Velocity.js一起工作？

我对速度有意见

我为一家我正在为其重新设计的公司创建了一个动画徽标，当我将其转换到网站登录页的HTML中并预览时，没有动画运行。我做了很多事情，用一个按钮替换了文档加载调用，使测试更容易，然后我从我正在使用的代码笔中取出功能代码，并将其复制到一个JSFIDLE中，但它不起作用

我检查了所有东西，同样的设置和库。我尝试过在头部和身体之间移动jQuery、Velocity和动画代码，每种变化和序列都是如此

运作

不起作用

以下是我编写的代码：

$( ".anbutton1" ).click(function() {

  $(".anpetal").velocity(
    "transition.expandIn", 
              {stagger: 5, drag:true, duration:1000}
  ).delay(4000)

  $(".anwords").velocity(
    "transition.expandIn", 
              {stagger: 65, drag:true, duration:1000}
  ).delay(4000)

});

如果我能让它在JSFIDLE中开始工作，我将非常高兴。

阅读控制台：

混合内容：通过HTTPS加载了“”处的页面，但请求了不安全的脚本“”。此请求已被阻止；内容必须通过HTTPS提供

tl；dr

您的JSFIDLE链接通过HTTPS托管，而Codepen通过HTTP托管（不安全）

将脚本更改为https://，它就会工作。

或者，如果您愿意，只需通过HTTP加载JSFIDLE，它也将按预期工作

---

---

还要记住将其更改为

onLoad

或

onDomready

，以便正确执行jQuery代码。

阅读控制台：

混合内容：位于'https://fiddle.jshell.net/_display/'已通过HTTPS加载，但请求的脚本不安全'http://cdn.jsdelivr.net/velocity/1.2.3/velocity.ui.min.js'. 此请求已被阻止；内容必须通过HTTPS提供。

还有一个不使用JFIDLE的原因！我一直用密码笔time@LOTUSMS我个人更喜欢JSFIDLE而不是Codepen，因为它的UI和功能都比Codepen好，但这只是我个人的看法。@LOTUSMS这个特殊的问题并不是使用一个而不是另一个的原因。HTTPS是好的——JSFIDLE在HTTPS上是好的。测试中的任何东西都不需要安全性。我喜欢能够在运行中进行测试。这解决了它，谢谢——总是像这样愚蠢的事情会给我带来最大的问题。你现在不能通过普通http加载JSFIDLE。他们需要在他们的数据库上运行grep，因为这非常烦人。。也无法编辑损坏的外部资源，您必须手动重新添加它：脸掌：：