hanibald Mester
09. marts 2020 - 20:45 Der er 4 kommentarer

HTML Area Farve

Jeg har lagt et antal areas ind over et billede. F.eks:
<area shape="circle" id="102" coords="190,158,10" href="#" alt="Punkt 102">

For alle areas har jeg behov for, at der vises statisk rød, når et area er inaktivt, og statisk grøn, når det er aktivt (efter "mouse up")

(CSS fra Bootstrap 4)

Hvordan kan jeg tilføje disse farver?
hanibald Mester
09. marts 2020 - 20:51 #1
Min kode til billede og mappe ser sådan ud:
<img src="plantegning.png" class="mx-auto" width="1028" height="765" alt="Plantegning" usemap="#plantegning">
<map name="plantegning">
<area shape="circle" id="102" coords="190,158,10" href="#" alt="Punkt 102">
</map
jakobdo Ekspert
09. marts 2020 - 20:58 #2
Kunne det være:

area:hover {background-color: green} i css ?
Slater Ekspert
09. marts 2020 - 22:05 #3
Et <area> er bare et klikbart stykke af et billede, det kan ikke have baggrundsfarver osv på.

Hvis du vil have en cirkel der er et link og som kan have en baggrundsfarve, kan du bruge et helt almindeligt <a> tag, give det en absolut position og border-radius: 50%; - det giver et cirkulært link der kan styles som ethvert andet element. Skal det være en mere unik form, er du nok nødt til at bruge canvas eller svg. Men <area> kan ikke.
hanibald Mester
11. marts 2020 - 00:11 #4
Tak for kommentarerne. Nu synes jeg at være næsten i mål med denne kode:
<style>
.absz{
    position: absolute;
    z-index: 1;
}
</style>   

    <div class="row pb-2"> <!-- Plantegning billede -->
        <div class="col-12 d-flex">
            <img src="plantegning.png" class="mx-auto" width="1028" height="765" alt="Plantegning">
            <div>
            <a  id="101" class="absz" style="top:50px;left:50px" href="#">x</a>
            </div>
        </div>
    </div><!-- row -->

Eneste udestående nu synes at være at "left" starter fra venstre side af container og ikke fra venstre side af billede.

Er det et "div"-problem eller et "mx-auto"-problem???
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
ERP-virksomhed har indført ubegrænset ferie for alle medarbejdere - og resultatet er en succes: "Medarbejderne knokler og har et smil på læben"
ERP-virksomheden Unit4 har indført ubegrænset betalt ferie for samtlige medarbejdere verden over, hvor man som ansat nu selv kan bestemme. "Som direktør har jeg det rigtig godt med det", siger dansk landechef Anders Holm Jørgensen. Ifølge ham kan medarbejderne sagtens administrere ordningen.
Computerworld
Stein Bagger gør comeback i ny branche: "De lignede et mafiahold, førte sig frem som nyrige og plaprede løs om urealistiske drømme"
Stein Bagger har skiftet navn og fører sig nu frem i store biler i en helt ny branche, skriver en dansk avis.
CIO
Podcast: Her er seks gode råd om ledelse og digitalisering fra danske top-CIO'er
The Digital Edge: Vi har talt med 17 af Danmarks dygtigste digitale ledere - og samlet deres seks bedste råd om digitalisering og ledelse. Få alle rådene på 26 minutter i denne episode af podcasten The Digital Edge.
Job & Karriere
Se Waoos forklaring: Derfor har selskabet fyret topchef Jørgen Stensgaard med omgående virkning
Waaos bestyrelse opsiger fiberselskabets topchef, Jørgen Stensgaard, der fratræder med omgående virkning. Se hele forklaringen fra Waao her.
White paper
Sådan øger du medarbejdertilfredshed og produktivitet
En af de mest effektive måder at øge medarbejdernes produktivitet og tilfredshed med arbejdspladsen er ved at give frit valg mellem Windows eller Mac, når der skal vælges arbejdscomputer. Samtidig mindskes presset på supporten, mens sikkerhedsniveauet højnes. Med en client-as-a-service aftale kan du lade medarbejderne selv træffe valget, men uden at uden at det behøver at være udfordrende eller ressourcekrævende for virksomheden. Eksempelvis kan du lade partneren håndtere alt fra finansiering, leverance, klargøring og implementering til support og lifecycle-management. Læs mere i denne hvidbog.