SVG動畫而非瀏覽器

-2

打開我有動畫的.SVG here但是當我在瀏覽器中打開它，我得到一個錯誤：SVG動畫而非瀏覽器

注意顏色不同，但代碼是相同的。

<svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64.32 84.01"> 
    <defs> 
    <style> 
     .cls-1{fill:#000000;}.cls-2,.cls-3{fill:none;stroke-miterlimit:10;}.cls-2{stroke:#000000;}.cls-3{stroke:#000000;} 
    </style> 
    </defs> 
    <title> 
    endless 60 
    </title> 
    <path class="cls-1" d="M14.45 1.65H1.18v6.11h8.65v1.19H-.01V.42h14.46v1.19zm0 21.92H0v-8.48h9.84v1.19H1.19v6.14h13.26v1.19zM17.59 52.68l-.76.92L1.19 40.76V53.6H0V38.22zM1.08 31.42l.76-.92 15.61 12.84V30.5h1.19v15.38zM6.13 60.91c15 0 15 23.1 0 23.1H.19v-23.1h5.94zm0 21.92c13.3 0 13.3-20.73 0-20.73H1.38v20.72h4.75zM25.62.42h1.19v22h13.27v1.19H25.62V.42zM40.08 31.69H26.81v6.11h8.64v1.19h-9.84v-8.48h14.46v1.19zm0 21.92H25.62v-8.49h9.83v1.19H26.8v6.11h13.27v1.19zM23.45 77.05c0 4 3.7 5.78 7.1 5.78s7.13-1.45 7.13-5.41c0-2.11-1-4.19-4.46-5.51-4.13-1.58-9.21-2.41-9.21-6.67 0-3.47 3.3-5.25 6.54-5.25s6.3 1.72 6.3 5.25h-1.2c0-2.77-2.61-4.16-5.25-4.16s-5.21 1.39-5.21 4.16c0 3.3 4.32 4.09 8.35 5.61s5.31 3.93 5.31 6.54c0 4.52-3.73 6.63-8.32 6.63-3.53 0-8.28-1.85-8.28-7h1.2zM46.63 17.06c0 4 3.7 5.78 7.1 5.78s7.13-1.45 7.13-5.41c0-2.11-1-4.19-4.46-5.51-4.13-1.58-9.21-2.41-9.21-6.67 0-3.47 3.3-5.25 6.54-5.25s6.3 1.72 6.3 5.25h-1.19c0-2.77-2.61-4.16-5.25-4.16s-5.21 1.39-5.21 4.16c0 3.3 4.32 4.09 8.35 5.61s5.31 3.93 5.31 6.54c0 4.52-3.73 6.63-8.32 6.63-3.53 0-8.28-1.85-8.28-7h1.19z"> 
    <animate 
      attributeName="opacity" 
      dur="2000ms" to="#f06d06" 
      animate repeatCount="indefinite"> 
    </animate> 
    </path> 


    <circle class="cls-2" cx="211.53" cy="732.35" r="4.06" transform="rotate(-30 -1168.947 677.542)"/> 
    <circle class="cls-2" cx="211.7" cy="744.16" r="7.65" transform="rotate(-30 -1168.77 689.35)"/> 
    <path class="cls-3" d="M63.82 72.01c0 5.71-4 10.83-9 10.83s-9-4.85-9-10.83 4-10.83 9-10.83 9 4.85 9 10.83z"/> 
    <path class="cls-1" d="M44.07 27.34h19"/> 
</svg>

任何想法爲什麼動畫和'80'不會出現。

謝謝

來源

2016-10-10 Brad Walls

爲什麼你提供一個鏈接到錯誤消息的圖片，而不是引用錯誤消息的？ – Quentin

錯誤消息對我來說似乎很清楚。那你知道嗎？ – Quentin

在SVG中，一個屬性必須有一個值，例如， selected="selected"。在這種情況下，你不需要動畫屬性。

這裏是你有什麼解決：

<animate 
    attributeName="opacity" 
    dur="2000ms" to="#f06d06" 
    repeatCount="indefinite"> 
</animate>

來源

2016-10-10 13:13:14

'animate =「animate」'不是''路徑的有效鍵值組合：https：//developer.mozilla.org/en-US/docs/Web/SVG/Element/animate –

謝謝，編輯。 –

您的<animate>路徑的額外屬性鍵。它應該是

<animate 
     attributeName="opacity" 
     dur="2000ms" to="#f06d06" 
     repeatCount="indefinite"> 
</animate>

我們看看<animate>文檔：https://developer.mozilla.org/en-US/docs/Web/SVG/Element/animate

來源

2016-10-10 13:15:46

SVG動畫而非瀏覽器

回答

相關問題