가능한 중복은 :
Changing SVG image color with javascript호버에서 SVG 이미지의 색상을 변경하려면 어떻게해야합니까?
나는 그것을 위에 마우스를 올려 때 SVG 이미지의 채우기를 변경하고 싶습니다.
지금 나는 Illustrator에서 SVG로 검은 색 물음표를 내보냈습니다. img 태그를 사용하여 내 페이지를 넣을 수 있지만 잘 표시되지만 코드에서 색상을 변경하는 방법을 알지 못합니다.
가능한 중복은 :
Changing SVG image color with javascript호버에서 SVG 이미지의 색상을 변경하려면 어떻게해야합니까?
나는 그것을 위에 마우스를 올려 때 SVG 이미지의 채우기를 변경하고 싶습니다.
지금 나는 Illustrator에서 SVG로 검은 색 물음표를 내보냈습니다. img 태그를 사용하여 내 페이지를 넣을 수 있지만 잘 표시되지만 코드에서 색상을 변경하는 방법을 알지 못합니다.
SVG 파일이 변경 될 수 있습니다 javascript에서 직접 가져올 수 있습니다. 즉, "이미지"의 속성은 DOM 내에서 액세스 할 수 있습니다. 스택 오버 플로우에서이 게시물
봐이 : modify stroke and fill of svg image with javascript
그것은 * 대신를 사용하여 일반적인 HTML * < IMG/> * 태그에 SVG 파일을 묶으 수없는, 즉 그렇게 기억하는 것이 중요 < svg> * ... ** < /svg>으로 표시됩니다.
편집 : 당신은 SVG 개체의 많은 속성을 볼 수 있도록 내가 W3 스쿨에 대한 링크를 추가
되세요 재미
w3schools의 svg는 404 (페이지를 찾을 수 없음)를 제공합니다. – Kaleab
코드를 게시 할 수 있다면 문제를 해결할 수 있습니다. 이 다음
시도 : 또는 http://tutorials.jenkov.com/svg/svg-and-css.html
(SVG에 배타적이지), 서로 다른 이미지의 코드의 이러한 유형의 사용
<img src="image1.svg"
onmouseover="this.src='image2.svg'"
onmouseout="this.src='image1.svg'">
이
라이브 데모가 : http://jsfiddle.net/JNChw/이
이미지 대체는 svg 경우의 호버 채우기 색상을 변경하는 것은 매우 비효율적 인 방법입니다. –
당신이 안 SVG에서 호버 효과를 수행해야하는 경우 < img> 태그를 사용하십시오. 대신 < iframe>, < 개체> 또는 < embed> 태그로 svg를 참조하십시오. http GET 요청을 저장하려면 html 문서에 svg 마크 업을 삽입 할 수 있습니다.
간단한 채움 호버 효과 inside an svg 및 another one (필터를 사용하여 마우스를 올리면 윤곽선을 만드는 데 약간 더 복잡함)을 보여주는 예입니다. 어쨌든, 기본적으로 : hover CSS 규칙을 적용하여 채우기 색상을 설정하는 것입니다.
위의 모든 방법으로 svg를 사용하는 예는 here입니다.
나는 SVG에 너무 익숙하지 않다. 마우스를 올리면 배경색을 바꿀 수 있을까? 얼마 전에 과제에 대해 다음과 같이했습니다. http://bit.ly/Q1Irwv – BillyNair