第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會有你想問的

SVG animate 啟動但未啟動

SVG animate 啟動但未啟動

拉莫斯之舞 2023-08-18 17:35:15
我有一個(gè)內(nèi)部 a ,它在沒有啟動變量的情況下啟動:<rect height={5} width={5}>     <animate          attributeName="height"          from={5} to={10} dur="2s"          begin={start ? "0s": "indefinite}/></rect>該組件位于 SVG 內(nèi)部,它會重新渲染以更改“start”變量以啟動動畫。但是,無論我何時(shí)選擇重新渲染動畫,動畫都會立即開始。因此,如果我在渲染其所在頁面后立即按下它,那么它將正常工作。但是,如果我在 2 秒后重新渲染組件,動畫將跳轉(zhuǎn)到最終值。如果我在渲染組件所在頁面后 1 秒啟動動畫,則動畫將從中間播放。到底是怎么回事?!
查看完整描述

1 回答

?
守著一只汪

TA貢獻(xiàn)1872條經(jīng)驗(yàn) 獲得超4個(gè)贊

begin和end時(shí)間,如果在不引用其他時(shí)鐘的情況下使用,則始終引用文檔的開頭。0s因此,您應(yīng)該使用其他參考,而不是將該值設(shè)置為。我想到了幾種可能性:


從點(diǎn)擊或其他事件開始。該begin值采用以下形式<id of event target element>.<event name>:


 <rect id="grafic" height={5} width={5}>

   <animate id="animation" attributeName="height"

            from={5} to={10} dur="2s" begin="grafic.click"/>

 </rect>

從其他一些代碼開始。該begin值保持在indefinite:


 <rect id="grafic" height={5} width={5}>

   <animate id="animation" attributeName="height"

            from={5} to={10} dur="2s" begin="indefinite"/>

 </rect>

但動畫是通過 API 調(diào)用啟動的:


 document.getElementById('animation').beginElement();

為了獲得更像 React 的感覺,請?jiān)谠O(shè)置屬性時(shí)定義“立即”的 wallckock 值:


 const rightnow = () => new Date().toLocaleTimeString()


 <rect id="grafic" height={5} width={5}>

   <animate id="animation" attributeName="height"

            from={5} to={10} dur="2s"

            begin={start ? `wallclock(${rightnow()})` : "indefinite"/>

 </rect>


查看完整回答
反對 回復(fù) 2023-08-18
  • 1 回答
  • 0 關(guān)注
  • 184 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號