nicht angemeldet
suit
suit
suit
Gunnar Bittersmann
suit
Gunnar Bittersmann
Felix Riesterer
Hallo,
ich würde gerne wissen ob es eine Möglichkeit gibt Schrift mit Javascript bunt zu machen, das heißt immer der nächste Buchstabe hat eine andere Farbe.
z.B.
H(rot)a(gelb)l(grün)l(blau)o(wieder rot)
Liebe Grüße
schn1tzel
Hi,
ich würde gerne wissen ob es eine Möglichkeit gibt Schrift mit Javascript bunt zu machen, das heißt immer der nächste Buchstabe hat eine andere Farbe.
Klar - du musst nur den jeweiligen Textknoten in einzelne Buchstaben aufsplitten, die du dann wiederum in eigene Elemente einsetzt (bspw. SPANs), die wiederum du dann einzeln formatieren kannst.
Mit ein bisschen Grundkenntnissen über den Umgang mit dem DOM durchaus umsetzbar.
MfG ChrisB
Om nah hoo pez nyeetz, schn1tzel!
Klar - du musst nur den jeweiligen Textknoten in einzelne Buchstaben aufsplitten, die du dann wiederum in eigene Elemente einsetzt (bspw. SPANs), die wiederum du dann einzeln formatieren kannst.
wenn es keine zufälligen Farben sein sollen, geht es so auch ohne JS.
Matthias
wenn es keine zufälligen Farben sein sollen, geht es so auch ohne JS.
Aber automatisch wirds dann etwas schwierig - es gibt zwar ::first-letter aber nicht ::second-letter oder ::nth-letter()
Om nah hoo pez nyeetz, suit!
wenn es keine zufälligen Farben sein sollen, geht es so auch ohne JS.
Aber automatisch wirds dann etwas schwierig
korrekt.
Das wär doch mal ein Verbesserungsvorschlag.
Matthias
Hallo,
wenn es keine zufälligen Farben sein sollen, geht es so auch ohne JS.
Aber automatisch wirds dann etwas schwierig
korrekt.
Nicht korrekt. Ein Span-Element für jeden Buchstaben hardcodieren und per CSS je eine Farbe zuordnen. Was ist daran schwierig?
Gruß, Don P
Nicht korrekt. Ein Span-Element für jeden Buchstaben hardcodieren und per CSS je eine Farbe zuordnen. Was ist daran schwierig?
"Ein span-Element für jeden Buchstaben hardcodieren" klingt für mich nicht sonderlich automatisch - ich kann mich aber auch täuschen :p
Om nah hoo pez nyeetz, Don P!
Hallo,
wenn es keine zufälligen Farben sein sollen, geht es so auch ohne JS.
Aber automatisch wirds dann etwas schwierig
korrekt.
Nicht korrekt. Ein Span-Element für jeden Buchstaben hardcodieren und per CSS je eine Farbe zuordnen. Was ist daran schwierig?
<span>s</span><span>c</span><span>h</span><span>w</span><span>i</span><span>e</span><span>r</span><span>i</span><span>g</span><span> n</span><span>i</span><span>c</span><span>h</span><span>t</span><span>,</span><span> a</span><span>b</span><span>e</span><span>r</span><span> ö</span><span>d</span><span>e</span><span> u</span><span>n</span><span>d</span> <span> l</span><span>a</span><span>n</span><span>g</span><span>w</span><span>e</span><span>i</span><span>l</span><span>i</span><span>g</span> Matthias
<span>s</span><span>c</span><span>h</span><span>w</span><span>i</span><span>e</span><span>r</span><span>i</span><span>g</span><span> n</span><span>i</span><span>c</span><span>h</span><span>t</span><span>,</span><span> a</span><span>b</span><span>e</span><span>r</span><span> ö</span><span>d</span><span>e</span><span> u</span><span>n</span><span>d</span> <span> l</span><span>a</span><span>n</span><span>g</span><span>w</span><span>e</span><span>i</span><span>l</span><span>i</span><span>g</span>
AAAAH!
@@apsel:
nuqneH
<span>s</span><span>c</span><span>h</span><span>w</span><span>i</span><span>e</span><span>r</span><span>i</span><span>g</span><span> n</span><span>i</span><span>c</span><span>h</span><span>t</span><span>,</span><span> a</span><span>b</span><span>e</span><span>r</span><span> ö</span><span>d</span><span>e</span><span> u</span><span>n</span><span>d</span> <span> l</span><span>a</span><span>n</span><span>g</span><span>w</span><span>e</span><span>i</span><span>l</span><span>i</span><span>g</span>
Man kann’s auch lesbar notieren:
<span>s</span><!--
--><span>c</span><!--
--><span>h</span><!--
--><span>w</span><!--
--><span>i</span><!--
--><span>e</span><!--
--><span>r</span><!--
--><span>i</span><!--
--><span>g</span>
<span>n</span><!--
--><span>i</span><!--
--><span>c</span><!--
--><span>h</span><!--
--><span>t</span><!--
--><span>,</span>
<span>a</span><!--
--><span>b</span><!--
--><span>e</span><!--
--><span>r</span>
<span>ö</span><!--
--><span>d</span><!--
--><span>e</span>
<span>u</span><!--
--><span>n</span><!--
--><span>d</span>
<span>l</span><!--
--><span>a</span><!--
--><span>n</span><!--
--><span>g</span><!--
--><span>w</span><!--
--><span>e</span><!--
--><span>i</span><!--
--><span>l</span><!--
--><span>i</span><!--
--><span>g</span>
Qapla'
Hallo,
Man kann’s auch lesbar notieren:
<span>ö</span><!--
--><span>d</span><!--
--><span>e</span>
Genau, und fast automatisch per RegEx-Suchen-Ersetzen zusammenbauen. Es schreibt ja wohl niemand einen Roman in dem Stil.
Mir ging's nur darum, dass es auch unschwer ohne JS geht. Wenn man unter "automatisch" natürlich eine tolle Animation versteht, dann wird's wirklich schwierig ohne JS.
Gruß, Don P
Man kann’s auch lesbar notieren:
Qapla'
Ums mit den Worten eines anderen Ausserirdischen zu sagen: Indeed!
@@ChrisB:
nuqneH
Klar - du musst nur den jeweiligen Textknoten in einzelne Buchstaben aufsplitten, die du dann wiederum in eigene Elemente einsetzt (bspw. SPANs), die wiederum du dann einzeln formatieren kannst.
Mit ein bisschen Grundkenntnissen über den Umgang mit dem DOM durchaus umsetzbar.
Auch ohne eigene Elemente und DOM:
<script type="text/javascript">
[code lang=javascript]var rainbow = ["#F00000", "#FF8000", "#FFFF00", "#00C000", "#0040F0", "#0000E0", "#8000C0"];
function coloredString(string, colors)
{
for (var i = 0; i < string.length; i++)
{
document.write(string[i].fontcolor(i < colors.length ? colors[i] : colors[colors.length - 1]));
}
}
~~~</script>
<p>Komm wir malen einen
<script type="text/javascript">`coloredString("Regenbogen", rainbow);`{:.language-javascript}</script>
<noscript>Regenbogen</noscript>
auf den grauen Pflasterstein!</p>[/code]
Oder doch lieber eine [Sonne](http://www.ostmusik.de/komm_wir_malen_eine_sonne1.htm)?
Qapla'
--
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
(Mark Twain)
Liebes schn1tzel,
Schrift mit Javascript bunt zu machen [...]
H(rot)a(gelb)l(grün)l(blau)o(wieder rot)
mein Animationsscript kann soetwas. Wenn Du willst, kannst Du seine Funktionsweise einmal analysieren.
Liebe Grüße,
Felix Riesterer.