内部带有 JS 的 SVG 无法在 img、对象或 iframe 中呈现
问题在标题中......请执行以下操作：（放入文件的代码如下）
制作一个 svg + 自己打开 svg（称之为 keysaway.svg）
制作html +自己打开html
你会看到 svg 运行非常简单的上下动画但是当链接到 html 文件时它不会工作......好吧，如果你检查元素你会看到 svg 文件中的 js 实际上正在运行并且圆圈正在上下移动，但它不会渲染，我不知道为什么，请看一下
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Testing</title>
</head>
<style>
:root {
--background: #131122 ;
}
*,
*::after,
*::before {
margin: 0;
padding: 0;
box-sizing: inherit;
font-size: 10px;
}
/*
colors:
#B31F15
#BD1748
#A61C8A
#A217BD
#6E15B3
*/
body {
font-family: "Lato", sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 1.7;
color: #777;
padding: 0;
box-sizing: border-box;
background-color:var(--background);
}
</style>
<body>
<!-- <img src="keysaway.svg">
<object type="image/svg+xml" data="keysaway.svg"></object> -->
<iframe src="keysaway.svg" frameborder="0"></iframe>
</body>
</html>
胡说叔叔1回答
-
互换的青春
包含<iframe>您的 svg 的 太小，动画显示在可见区域之外。当您增加 iframe 高度时，动画变得可见，例如：<iframe src="keysaway.svg" frameborder="0" style="height:800px"></iframe>
随时随地看视频慕课网APP
相关分类
JavaScript