Skift farve på en SVG Fil
HejJeg har lavet en SVG fil, som jeg ønsker at ændre farve på.
Jeg har lavet alt SVG'en og mangler så koden.
Jeg forestiller mig, at det skal laves med klik, men en mouseover løsning vil også kunne bruges,
Der skal muligvis være en send knap mere, men så laver jeg den.
Løsningen skal muligvis benytte JavaScript eller CSS, det er OK bare den virker.
Jeg er rimelig nybegynder og må derfor søge om hjælp til dette.
Koden herunder
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h2>Eksempel p책 SVG Farveskifter</h2>
<svg height="700" width="1000">
<rect x="20" y="20" width="750" height="400" style="fill:rgb(180,80,255);stroke-width:10;stroke:rgb(0,0,0)" />
<rect x="20" y="20" width="750" height="10" style="fill:rgb(0,0,255);stroke-width:10;stroke:rgb(0,0,0)" />
<rect x="20" y="420" width="750" height="40" style="fill:rgb(0,0,0);stroke-width:10;stroke:rgb(0,0,0)" />
<rect x="270" y="20" width="1" height="400" style="fill:rgb(0,0,0);stroke-width:8;stroke:rgb(0,0,0)" />
<rect x="520" y="20" width="1" height="400" style="fill:rgb(0,0,0);stroke-width:8;stroke:rgb(0,0,0)" />
<rect x="275" y="100" width="240" height="5" style="fill:rgb(0,0,0);stroke-width:1;stroke:rgb(0,0,0)" />
<rect x="275" y="180" width="240" height="5" style="fill:rgb(0,0,0);stroke-width:1;stroke:rgb(0,0,0)" />
<rect x="275" y="260" width="240" height="5" style="fill:rgb(0,0,0);stroke-width:1;stroke:rgb(0,0,0)" />
<rect x="20" y="500" width="60" height="40" style="fill:rgb(0,0,255);stroke-width:5;stroke:rgb(0,0,0)" />
<rect x="120" y="500" width="60" height="40" style="fill:rgb(0,255,0);stroke-width:5;stroke:rgb(0,0,0)" />
<rect x="220" y="500" width="60" height="40" style="fill:rgb(255,0,0);stroke-width:5;stroke:rgb(0,0,0)" />
<rect x="450" y="500" width="60" height="40" style="fill:rgb(255,255,255);stroke-width:5;stroke:rgb(0,0,0)" />
<rect x="580" y="500" width="60" height="40" style="fill:rgb(255,255,255);stroke-width:5;stroke:rgb(0,0,0)" />
<rect x="710" y="500" width="60" height="40" style="fill:rgb(255,255,255);stroke-width:5;stroke:rgb(0,0,0)" />
<text fill="#000000" font-size="30" font-family="Verdana"
x="20" y="580">Klik p책 en farve </text>
<text fill="#000000" font-size="30" font-family="Verdana"
x="20" y="620">for farveskift</text>
<text fill="#000000" font-size="30" font-family="Verdana"
x="350" y="530">rgb: r</text>
<text fill="#000000" font-size="30" font-family="Verdana"
x="555" y="530">g</text>
<text fill="#000000" font-size="30" font-family="Verdana"
x="685" y="530">b</text>
<text fill="#000000" font-size="30" font-family="Verdana"
x="350" y="580">Skriv tal i rammerne</text>
<text fill="#000000" font-size="30" font-family="Verdana"
x="350" y="620">tal mellem 0 til 255</text>
</svg>
</body>
</html>
Mvh Emma
