Ist es möglich, die Textfarbe basierend auf der Hintergrundfarbe dynamisch mit CSS oder JS zu ändern, wenn dies mit CSS nicht möglich ist? Ich habe ein Bild, das unter den Text kommt. Meine Textfarbe ist weiß, aber das Bild hat eine weiße Form. Und wenn Text über die weiße Form hinausgeht, muss ich die Textfarbe in einer dunkleren Farbe ändern.
HTML:
%Vor%CSS:
%Vor%Hier ist ein Codepen , um das bessere Bild zu sehen.
Wahrscheinlich brauchen Sie das:
Textfarbe basierend auf der Helligkeit von ändern der abgedeckte Hintergrundbereich?
%Vor%Aktualisiert:
Verwenden Sie dieses Beispiel auf JSFiddle , ändern Sie einfach background color
Für diese Art von Problem würde ich eine reine CSS-Lösung verwenden, um den Text zu umreißen ...
%Vor% Ändern Sie die letter-spacing und die finale Direktive der text-shadow -Eigenschaft entsprechend Ihren Anforderungen.
Es gibt einige Möglichkeiten, dies zu erreichen. Sie könnten das Bild auf einer (versteckten) Leinwand rendern und die Bildfarben analysieren, um zu wissen, in welcher Farbe der Text sein soll. Sie könnten auch das gleiche mit php machen und die Bildfarbeninformation vorverarbeiten.
Ich habe auch diese JavaScript-Bibliothek gefunden, die Ihnen helfen könnte: Ссылка . (Sie können jeden Buchstaben in ein Span-Element einschließen, um die richtige Farbe für jeden Buchstaben zu bestimmen.)
Tags und Links javascript html jquery css