Hello, World!
이전 목록 다음
채택완료

혹시 svg아시는분 있나요..기초적인건데 잘 몰라서 질문드립니다.

ssmltree
프로필 보기이 회원 글보기이 회원의 댓글보기
 3년 전 1,576

아래 소스는 svg 소스입니다.
이제 막 svg를 시작하는 사람이라 아무것도 모르는데요

아래 소스는 네모안에 "가나다라"가 나타났다 사라졌다 하는데

제가 원하는건 "가나다라"가 나오고 지워지고 "마바사아"가 나오는것입니다.

근데 이렇게 하면 글자가 겹쳐나오고
제 생각대로 안됩니다.

어떻게 해야 할까요?

 

Copy 
<!DOCTYPE html>

<html>

<body>

<svg width="120" height="60">

  <rect width="120" height="60" style="fill:#FFFFFF;stroke-width:1;stroke:rgb(0,0,0);" />

 

  <text x="20" y="35" fill="red">가나다라</text>

  <animate attributeType="CSS" attributeName="opacity" from="1" to="0" dur="3s" repeatCount="indefinite" />

  

    <text x="20" y="35" fill="red">마바사아</text>

</svg>

 

</body>

</html>
그누보드5
|

답변 1개

채택된 답변
+20 포인트
배배르만
프로필 보기이 회원 글보기이 회원의 댓글보기
 3년 전

Copy 
<!DOCTYPE html>
<html>
<body>
<svg width="120" height="60">
  <rect width="120" height="60" style="fill:#FFFFFF;stroke-width:1;stroke:rgb(0,0,0);" />
 
  <text x="20" y="35" fill="red">가나다라
    <animate attributeType="CSS" attributeName="opacity" values="1;0.5;0;0;0;0;0;0.5;1" dur="3s" repeatCount="indefinite" />
  </text>
  <text x="20" y="35" fill="red">마바사아
    <animate attributeType="CSS" attributeName="opacity" values="0;0;0;0.5;1;0.5;0;0;0" dur="3s" repeatCount="indefinite" />
  </text>
</svg>
 
</body>
</html>

답변을 작성하려면 로그인이 필요합니다.