Emma Novice
14. december 2020 - 10:59

Skift farve på en SVG Fil

Hej
Jeg 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
Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links

Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester





Premium
IBM sætter flere navne på topledelsen for sit nye selskab 'NewCo'
Der er blevet sat navne på flere af de aboslutte topposter i IBM's nye driftsselskab, NewCo. Ind til videre fisker IBM inden for egne rækker.
Computerworld
Trump bønfalder Helle Thorning: Giv mig min Facebook-konto tilbage
Facebooks tilsynsråd, der har Helle Thorning-Schmidt i spidsen, har modtaget en erklæring fra Donald Trump, som ønsker at få genoprettet adgangen til sin Facebook og Instagram-konto.
CIO
Har du rost din mellemleder i dag? Snart er de uddøde - og det er et tab
Computerworld mener: Mellemledere lever livet farligt: Topledelsen får konstant ideer med skiftende hold i virkeligheden, og moden går mod flade agile organisationer. Men mellemlederen er en overset hverdagens helt med et kæmpe ansvar. Her er min hyldest til den ofte latterliggjorte mellemleder.
Job & Karriere
IBM Danmark trækker tilbud om frivillige fratrædelser tilbage for stort antal ansatte: "IBM har taget røven på sine ansatte"
Som led i IBM Danmarks store fyringsrunde fik 130 ansatte grønt lys til at forlade selskabet på en frivillig fratrædelsesordning. Men nu har IBM Danmark trukket det oprindelige tilbud tilbage for størstedelen af de ansatte.
White paper
Overser du muligheder for at optimere din Dynamics-investering?
Der er omfattende og ofte oversete muligheder for at understøtte centrale forretningsprocesser med Dynamics 365 Finance & Operations.