• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Kolory napisów

VPS Starter Arubacloud
0 głosów
750 wizyt
pytanie zadane 13 kwietnia 2016 w JavaScript przez mlasota Początkujący (300 p.)

Siema mam taki problem na podstawie 2 i 3 lekcji Pana Mirosława chciałem stworzyć program który napis zmienia kolory.Prawię się udało ale nie do końca ponieważ zawsze ładuje mi się przykładowo napis później napis z innym kolorem a chciałbym żeby był tylko jeden który zmienia sobie kolory automatycznie.

var napis1 = "taki napis";

var numer = Math.floor(Math.random()*2)+1;
var kolory = new Array(4);
kolory[0]='<span style = "color:blue">'+napis1+'</span>'
kolory[1]='<span style = "color:#404040">'+napis1+'</span>'
kolory[2]='<span style = "color:990066">'+napis1+'</span>'
kolory[3]='<span style = "color:red">'+napis1+'</span>'

var timer1 = 0;
var timer2 = 0;

function schowaj()
{
$("#napis").fadeOut(500);
}


function spr()
{
   numer++; if (numer>3) numer=1;

	var plik = document.write(kolory[numer]);
	$("#napis").fadeIn(500);
	timer1 = setTimeout("spr()", 5000);
	timer2 = setTimeout("schowaj()", 4500);
  
document.getElementById("napis").innerHTML = plik;
}

 

4 odpowiedzi

0 głosów
odpowiedź 13 kwietnia 2016 przez KubenQPL Maniak (62,820 p.)
Dajesz tylko jeden span twój tekst A potem document.getElementById("napis").color = kolor;
0 głosów
odpowiedź 13 kwietnia 2016 przez CzlowiekSkrypt Nałogowiec (26,340 p.)
Sprawdzałeś co zwraca ta tablica? Bo mam wrażenie że tak się nie da przypisać elementów, no i brakuje średników.
0 głosów
odpowiedź 13 kwietnia 2016 przez ScriptyChris Mędrzec (190,190 p.)

Po pierwsze, mógłbyś napisać swój post bardziej po polsku :)

Co kodu, to:

timeoutID is the numerical ID of the timeout, which can be used later with window.clearTimeout().

wartość zwracana z funkcji setTimeout() jest wykorzystywana do późniejszego, ewentualnego, jego wyczyszczenia - podobnie jak w setInterval(). Ty natomiast nic nie robisz dalej z tymi zmiennymi timer1 / timer2, więc po co Ci one są potrzebne? 

komentarz 15 kwietnia 2016 przez mlasota Początkujący (300 p.)
zrobiłem coś takiego lecz span kolor nie widzi tej tablicy ??
​
 </span>
function spr()
{
	var napis1 = "taki napis";
 
	kolory = new Array ("red","blue","green");
    
	for(numer=0; numer<=3; numer++)
{
    var plik = '<span style = "color:'+kolory[numer]+'">'+napis1+'</span>'
}
   

  document.getElementById("napis").innerHTML = plik;
}
komentarz 15 kwietnia 2016 przez ScriptyChris Mędrzec (190,190 p.)
edycja 15 kwietnia 2016 przez ScriptyChris

Popełniłeś tu kilka błędów:

  • zmienną kolory tworzysz bez słówka var, co oznacza, że jest ona globalna - zmienne globalne to zły pomysł, a przypadkowo utworzone (zapominanie o słówku var) to już bardzo zły pomysł
  • w pętli for również tworzysz globalną zmienną numer
  • wewnątrz pętli z kolei tworzysz zmienną lokalną plik - dostępną tylko wewnątrz pętli, w której zmieniasz atrybuty spana. Ta lokalna zmienna plik nie jest widziana poza pętlą, dlatego zapewne w konsoli dla linijki 16 wyświetla się błąd "plik is not defined"
komentarz 15 kwietnia 2016 przez mlasota Początkujący (300 p.)

function spr()
{
   	var plik ="";
   var napis1 = "taki napis";
  
  var kolory = new Array ("red","blue","green");
     
    for(numer=0; numer<=kolory.length; numer++)
{
     plik = '<span style = "color:'+kolory[numer]+'">'+napis1+'</span>'
     document.getElementById("napis").innerHTML = plik;
	}
    
 
  
}

i w konsoli zmienia kolor po kolei chciałbym żeby napis1 pokazywał mi to zmianę kolorów najpierw czerwony ,niebieski,brązowy i tak cały czas.

komentarz 15 kwietnia 2016 przez ScriptyChris Mędrzec (190,190 p.)

Nie bardzo wiem co chcesz uzyskać, tzn. jak napis1 ma pokazywać tą zmianę?

Coś takiego? "taki napis" dodany w różnych kolorach (z tablicy kolory)

function spr()
{
    var plik,
        napis1 = "taki napis",
        kolory = ["red","blue","green"];
      
    for(var numer = 0; numer < kolory.length; numer++)
    {
     var txt = document.createTextNode(napis1);
     
     plik = document.createElement('span');
     plik.appendChild(txt);
     plik.classList.add(kolory[numer]);

     document.getElementById("napis").appendChild(plik);
    }       
}

CSS

.red
{
  color: red;
}

.green
{
  color: green;
}

.blue
{
  color: blue;
}

span
{
  display: block;
}

 

komentarz 15 kwietnia 2016 przez mlasota Początkujący (300 p.)
dziękuje bardzo za poświęcony czas ,ale chodzi o to żeby  kolor napisu się automatycznie zmieniał
komentarz 15 kwietnia 2016 przez ScriptyChris Mędrzec (190,190 p.)
Automatycznie? To wrzuc funkcje w setInterval() i bedzie się powtarzać
0 głosów
odpowiedź 20 kwietnia 2016 przez mlasota Początkujący (300 p.)
var napis1 = "taki napis";
 
var numer = Math.floor(Math.random()*4)+1;
var kolory = new Array ("red","blue","green","yellow","#993366"); 
function spr()
{
   numer++; if (numer>kolory.length) numer=1;
 
    var plik = '<span style = "color:'+kolory[numer]+'">'+napis1+'</span>';
    setTimeout("spr()", 1000);
   
   
document.getElementById("napis").innerHTML = plik;
}

Po burzy mózgu początkującego się udało dziękuje wszystkim za pomoc i za cenne wskazówki

Podobne pytania

0 głosów
3 odpowiedzi 2,644 wizyt
pytanie zadane 19 kwietnia 2016 w C i C++ przez Proszek73 Obywatel (1,140 p.)
0 głosów
3 odpowiedzi 1,203 wizyt
0 głosów
2 odpowiedzi 463 wizyt

92,452 zapytań

141,262 odpowiedzi

319,085 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...