Ik heb Verloop gebruikt om de kleur voor mijn HTML-lichaamsachtergrond in te stellen.
CSS:
background: linear-gradient(to top, #fb4080 10%,#ebb523 22%,#58d27c 40%,#2aff00 52%,#0fd2b7 65%,#6b6dff 80%,#ff05ea 100%);
Nu is de body gevuld met meerdere kleuren. Hoe kan ik met een javascript de RGB- of hex-kleurcodewaarden van een bepaald gedeelte van de pagina krijgen?
Voorbeeld:
Als ik op mijn pagina scrol, wil ik de kleur van het bovenste gedeelte van de
pagina (de kleur in het gemarkeerde gedeelte niet precies maar waarden ernaast) Zodat ik die kleurcode kan toewijzen / instellen aan een ander element op mijn pagina, zoals navigatiebalk, menu enz.
Heeft u suggesties?
Antwoord 1, autoriteit 100%
Ik zou hier de volgende opties kunnen bedenken:
-
Bereken het verloop in Javascript waarvan u in staat zou moeten zijn
om de pixelwaarde te krijgen
Hoe bereken je alle kleuren in een verloop? -
Maak een verborgen canvas met hetzelfde verloop en kies de pixel
van dit canvas
http://www.html5canvastutorials.com/tutorials/html5-canvas-linear -gradiënten/ -
Gebruik een screenshotbibliotheek voor Javascript en kies de pixel uit
de screenshotgegevens.
HTML5/Canvas/JavaScript gebruiken om schermafbeeldingen te maken
Antwoord 2, autoriteit 100%
Canvas- en afbeeldingsobjecten zijn de enige objecten waarvan u pixelwaarden kunt lezen.
In plaats van een CSS-verloop te gebruiken, kunt u een canvas achter de hoofdtekst van uw pagina maken en het verloop in het canvas weergeven. Daarna kun je een kleur uit het canvas kiezen. Een compleet voorbeeld staat in mijn antwoordop de vraag “Hoe de achtergrond van een element gelijk te stellen aan een specifiek gedeelte van een webpagina“.