脚本

Question

gfycat.com提供了使用 JS Embed 选项在我的网站上嵌入GIF的选项。

我得到这样的代码：

<img class='gfyitem' data-id='HighMelodicDairycow' />

我无法在网站上找到有关运行它所需的Javascipt代码的任何信息的问题。有什么想法吗？

Answer 1

我无法在他们的网站上找到它，但这里是他们的GitHub回购嵌入第三方网站：https://github.com/gfycat/gfycat.js/tree/master

以下是自述文件中的重要部分：

脚本

要使JS嵌入工作，您只需要在打开的正文标记后添加：

<script>
  (function(d, s, id){
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement(s); js.id = id;
    js.src = "https://assets.gfycat.com/gfycat.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'gfycat-js'));
</script>

当此脚本运行时，任何具有类gfyitem的元素都将转换为嵌入的Gfycat。

可用选项

如果您想要更改嵌入的行为，可以将这些作为数据属性添加到元素中。（data-）

data-id：Gfycat ID（必需）
data-controls：包含暂停/速度/等控件（默认：false）
data-title：在悬停时显示标题（默认：false）
data-autoplay：在页面加载时自动开始播放（默认：true）
data-expand（ DEPRECATED ，请使用data-responsive）：展开视频元素以填充其容器的空间（默认：{{1 }}）
false：展开视频元素以填充其容器的空间（默认：data-responsive）
false（仅与data-max-height一起使用）：为响应视频设置高度上限
data-responsive=true：在50％可见时播放视频，延迟加载GIF（默认：data-optimize）
true：加载.gif文件而不是视频（默认：data-gif）
false：加载高质量视频（默认：data-hd）
true：设置视频播放速度，时间间隔[data-playback-speed，0.125]（默认：8）

我知道你这可能为时已晚，无法帮助你，但希望这可以帮助其他任何遇到此问题的人。

JS在我的网站上嵌入gfycat

1 个答案:

脚本

可用选项