06. oktober 2007 - 00:26Der er
10 kommentarer og 2 løsninger
Skifte farve på sidste ord
Jeg har set på nogle blogs at f.eks. overskriften har en anden farve på det sidste ord, f.eks. hvor teksten "Adam og Eva" er delt i to farver hvor "Adam og" er i sort og "Eva" er i blå. Jeg går stærkt ud fra at brugeren ikke sidder og aktivt skifter farve hver gang denne opretter et indlæg.
Nej, brugeren gør nok ikke - men det er fuldt tænkeligt at blog-softwaren gør det.
I så fald skal softwaren selv finde det sidste ord og placere det i en <span> og sætte en anden farve på denne. Det kunne snildt gøres med noget regexp.
Nu ved jeg ikke hvad du koder, men det er nok noget man ville fikse i sit scripting sprog normalt.. om det så er PHP,ASP, ASP.NET osv.
men dette virker uanset hvad du benytter selv - måske kan de 2 andre deltagere herinde "optimere" på det, men tænkte, at du i hvertfald kunne få et bud:) Måske er det fint nok til det du skal bruge!
olebole >> jeg antager, at brugen af innerHTML i dette tilfælde er valid nok når der skal udskrives HTML:-) kender ikke en anden metode i hvertfald.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <script type="text/javascript"> function ModifyColors() { var label = document.getElementById("Title"); var innerText = label.firstChild.nodeValue; var values = innerText.split(" "); var newText = new String(); if(values.length > 2) { for(var i = 0; i < values.length; i++) { if(i == 0) { newText += "<span style=\"color:blue;\">"+ values[i] + "</span> "; } if(i == 1) { newText += "<span style=\"color:red;\">"+ values[i] + "</span> "; } if(i == 2) { newText += "<span style=\"color:green;\">"+ values[i] + "</span> "; } //Du kan lave flere if sætninger hvis det er nødvendigt - kan nok aldrig blive for mange når det kun er en overskrift du skal style. } label.innerHTML = newText; } } </script>
hvis det kun er ét ord der skal farves og det er det sidste kan koden ændres til
if(values.length > 2) { for(var i = 0; i < values.length; i++) { if(i == values.length-1) { newText += "<span style=\"color:blue;\">"+ values[i] + "</span> "; } else { newText += "<span>"+ values[i] + "</span> "; } //Du kan lave flere if sætninger hvis det er nødvendigt - kan nok aldrig blive for mange når det kun er en overskrift du skal style. } label.innerHTML = newText; }
Nej, brugen af innerHTML hører sammen med font-, blink- og marquee-tags - store frameset og layout i kæmpe tabel-helveder - til i WWW's yngre jernalder i midten/slutningen af 90'erne. Det kan bruges til en hurtig 'cowboy-test', men er ikke noget, der kan bruges i seriøs kode :)
Nu kunne jeg selvfølgelig lige lave et par tests videre for at få det til at fungerer på en anden måde, men hvem siger det bliver mere korrekt af den årsag:P Jeg prøvede med .nodeValue men det udskrev bare html'en.
så hvordan er den korrekte måde, at udskrive min html på?
kalp >> I moderne frontend kodning giver det ikke mening at tale om HTML i strenge. Det har det i virkeligheden aldrig gjort, da innerHTML, outerHTML og innerText aldrig har været valide properties - men tilbage i 90'erne var der ikke andre muligheder for at ændre dokumentet. Siden IE5.0 og NS6.0 har der dog været mulighed for at bruge DOM i stedet, så der er ingen grund til at bruge invalid kode - som ovenikøbet fungerer dårligt sammen med anden scripting.
samsayit >> Hvilket serversprog bruger du? Det bedste ville være at gøre det på serveren, så der f.eks. kommer til at stå: <h2>En eller anden <span>overskrift</span></h2>
Mange tak til jer alle. Jeg vil forsøge mig med forslagene i næste uge når jeg er tilbage på pinden. Hvis I opretter svar så laver jeg en pointfordeling.
Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.
Ny bruger
Nybegynder
Opret
Preview
