Java script: sinusoide ze znaków wzrastajacych do 7 i zmiejszajacych sie do 1 i tak dalej

pytanie zadane 5 października 2020 w JavaScript przez chrystian Gaduła (4,780 p.)

<html>
<head></head>
<body>
<script>
//1 do 7 
a="Ala ma kota i poszła na spacer";
var c=1;
var f=7;
d=a.length;

for(b=1;b<=d-1;b++)
{
switch(b)
{
	case 1:
	{
		c=1;
		f--;
		break;
	}
	case 2:
	{
		c=2;
		f--;
		break;
	}
	case 3:
	{
		c=3;
		f--;
		break;
	}
	case 4:
	{
		c=4;
		f--;
		break;
	}
	case 5:
	{
		c=5;
		f--;
		break;
	}
	case 6:
	{
		c=6;
		f--;
		break;
	}
	
	case 7:
	{
		c=7;
		c=f;
		break;
	}
	
	
	
}
	document.write(a.charAt(b).fontsize(c));
}
	
</script>
</body>
<html>

komentarz 5 października 2020 przez mokrowski Mędrzec (155,460 p.)

Pytanie? Prośba? Telepatia?

komentarz 5 października 2020 przez ScriptyChris Mędrzec (190,190 p.)

@chrystian, wstawiłeś kod nie podając z czym dokładnie masz problem ani co w nim nie działa. Proszę popraw opis tematu zgodnie z regulaminem.

1 odpowiedź

odpowiedź 5 października 2020 przez DawidK Nałogowiec (37,910 p.)

Po pytaniu i fragmencie kodu zgaduje, że chodzi Ci o mniej więcej taki efekt:

czyli w formie "pagórków".

Pewnie jest prostrzy sposób, ale taki efekt możesz osiągnąć tworząc dla każej litery osobnego spana i ustawiając jego wielkość czcionki, żeby to zrobić w pętli trzeba przeiterować po całym tekście, utworzyć dla każdej litery span, przypisać kolejną literę i ustawić jej wielkość.

Litery będą albo maleć albo rosnąć. Zmienna isBigger na true oznacza, że litera jest w "fazie rosnącej", gdy osiągnie najwyższą możliwą wartość isBigger zmieni się na false i zacznie się "faza zmniejszania" i w tym przypadku podobnie osiągnięcie najmniejsze wartości ponownie zmieni stan ma "faze rosnącą".

Pozatym litery będą rosły i malały tylko wtedy gdy znajdują się w danej "fazie" i jeszcze nie osiągneły najwyższej/najniżeszej wartości.

W przykładzie napis rośnie w przedziale 12-40px co 2 (żeby lepiej to pokazać)

<html>

<head></head>

<body>
    <script>

        const text = 'Ala ma kota i poszła na spacer';
        let fromFontSize = 12;
        let toFontSize = 40;
        let actualFont = fromFontSize;
        let isBigger = true;

        for (i = 0; i < text.length; i++) {
            let letter = document.createElement('span');
            letter.textContent = text.charAt(i);
            letter.style.fontSize = `${actualFont}px`;
            document.body.appendChild(letter);

            if (actualFont == toFontSize) {
                isBigger = false;
            }
            if (actualFont == fromFontSize) {
                isBigger = true;
            }
            if (isBigger && (actualFont < toFontSize)) {
                actualFont += 2;
            }
            if (!isBigger && (actualFont > fromFontSize)) {
                actualFont -= 2;
            }
        }
    </script>
</body>
<html>