-webkit-linear-gradient - Problem....kleines !

[oefchen]

Hallo Leute, ich muss jetzt doch mal um Hilfe bitten.

Ich setze die -webkit-linear-gradient´ten gern und oft ein. Nicht das ich die Befehle verstehe....copy-paste halt und die Farben kann ich schon durch try-and-error verändern.
Nun möcht ich einen Balken nicht von oben nach unten ansteigen lassen, sondern von unten nach oben...
also den hier:

-webkit-linear-gradient(rgba(0,0,0,1) 0%, rgba(0,0,0,1) {#/100*100}%, rgba(255,0,0,0.0) {#/100*100}%, rgba(255,0,0,0.0) 100%)

Der soll im Endeffekt die Abs.Position der Jakou anzeigen...bzw. verdecken.

So hier: Die Jalou-Symbole laufen untereinander bis 100% und zeigen die Lammellenstellung an... ....und sollen je nach Jalou-Pos. verdeckt werden. Ich hab den hier gedreht...funktioniert natürlich so nicht...weil die Werte natürlich von der falschen Seite kommen.

balken.PNG

Ich bin sicher das ist für viele hier gaaaaanz einfach

[oefchen]

...Hat mir keine Ruhe gelassen und irgendwann hab selbst ich begriffen das das über Winkel funzt.
Also von unten...90° gedrehter Start des Verlaufes und werte invertiert:

-webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) {100-#/100*100}%, rgba(255,0,0,0.0) {100-#/100*100}%, rgba(255,0,0,0.0) 100%)

[SvenA]

Nicht das ich die Befehle verstehe....copy-paste halt und die Farben kann ich schon durch try-and-error verändern.

Man muss da ja nicht alles verstehen ,aber dies ist vielleicht einfacher als einfach raten:
https://cssgradient.io/
(Gibt sonst auch noch diverse andere Generatoren im Netz...)

Gruß
Sven

[oefchen]

Danke SvenA Recht hast Du....und die Seite kannte ich noch nicht. Hab mich natürlich durch einige Seiten gewühlt...die Gradfunktion hab ich so nicht sofort gefunden.
...abgespeichert.