Avatar billede bugger Nybegynder
07. september 2004 - 13:30 Der er 17 kommentarer og
1 løsning

Knap som ændrer skriftstørrelse

Hejsa
Hvordan laver man en knap som kan lave tekststørrelsen større (og en der kan lave den mindre?) Se evt. her
http://www.cmforum.dk/artikler/artikel1.html
og prøv at klikke på de små dimser der er øverst på siden.
Det er da javascript der skal bruges, ikke? -for der sker da vist ikke noget serverpush.

Thx
Bugger
Avatar billede thesurfer Nybegynder
07. september 2004 - 13:45 #1
Det ser noget kompliceret ud: http://www.cmforum.dk/css/styleswitcher.js
Avatar billede roenving Novice
07. september 2004 - 13:46 #2
De har simpelthen 5 forskellige stylesheets, som bruges til de forskellige tekststørrelser (og sikkert et 6. eller flere til det, som ikke er tekst !-)

Ved at disable eller enable et stylesheet kan man ændre på en masse properties !-)
Avatar billede thesurfer Nybegynder
07. september 2004 - 13:46 #3
og dog.. egentligt er det ikke så kompliceret igen..
Avatar billede thb Nybegynder
07. september 2004 - 13:50 #4
Kan man ikke skrive noget i stil med:

document.getElementById('tekstfelt').styl.fontSize = '12';

og så har man alt teksten i et div...

Ved ikke om det virker...

Thomas
Avatar billede thb Nybegynder
07. september 2004 - 13:50 #5
Det skulle selvfølgelig være style istedet for styl
Avatar billede bugger Nybegynder
07. september 2004 - 13:52 #6
Er der nogen af jer der ville være istand til at lave en side med noget tekst og to knapper der på tilsvarende vis kan ændre tekststørrelsen?
--Jeg synes faktisk at det er ganske smart
Avatar billede roenving Novice
07. september 2004 - 13:52 #7
Jo, men det er ikke alle elementer, som arver sådan noget som tekststørrelse, så hvis du f.eks. har nogle tabeller, vil teksten derinde i ikke bliver ændret !-)
Avatar billede sbm Nybegynder
07. september 2004 - 13:56 #8
<html>
<head>
<script language=JavaScript1.2>
var fontsize = 10;
</script>
</head>
<body>
<input type="button" name="bigger" value="bigger" onclick="fontsize=fontsize+2;self.document.body.style.fontSize=fontsize;" />
<input type="button" name="smaller" value="smaller" onclick="fontsize=fontsize-2;self.document.body.style.fontSize=fontsize;" />
<br />
<h2>Overskrift</h2>
Br&oslash;dtekst<br />
</body>
</html>
Avatar billede sbm Nybegynder
07. september 2004 - 13:57 #9
Jeg er ikke helt sikker på om det er det du søger, men jeg ville lige prøve. :-)
Avatar billede sbm Nybegynder
07. september 2004 - 13:58 #10
Hov. Lige for en ordens skyld, skal body-tagget have en onload:

<body onload="self.document.body.style.fontSize=fontsize;">
Avatar billede roenving Novice
07. september 2004 - 14:00 #11
Nemmeste metode:

Lav f.eks. 5 (næsten !-) ens stylesheets, hvor de eneste style-properties, som bliver sat, er font-size, så du kan sætte det op, så de harmonerer ...

Dem sætter du som de første linkede stylesheets, og sætter som udgangspunkt disabled på de 4 af dem ...

Så laver du to billed-knapper, med en onclick="chStSheet(1)" og onclick="chStSheet(-1)" på ...

En variabel til at indeholde det aktuelle valg, og en funktion:

var actStSheet = 2;
function chStSheet(dir){
  if((actStSheet==0&&dir==-1)||(actStSheet==4&&dir==1))return;
  document.styleSheets[actStSheet].disabled = true;
  document.styleSheets[actStSheet+dir].disabled = false;
}
Avatar billede roenving Novice
07. september 2004 - 14:02 #12
-- og cookien kan også være en god ide !-)

-- desværre har jeg ikke tid til at gøre det for alvor lige nu, men mon ikke en af de andre kunne bruge lidt af ideen ?-)

-- og jeg glemte lige:

var actStSheet = 2;
function chStSheet(dir){
  if((actStSheet==0&&dir==-1)||(actStSheet==4&&dir==1))return;
  document.styleSheets[actStSheet].disabled = true;
  actStSheet += dir;
  document.styleSheets[actStSheet].disabled = false;
}
Avatar billede bugger Nybegynder
07. september 2004 - 14:16 #13
Tak skal I have, jeg vil prøve at makke lidt med det.  (Nu er jeg jo ikke den skarpeste kniv i skuffen til javascript, så jeg havde håbet at jeg kunne copy/paste mig frem til et brugbart resultat)
roenving, det ser rigtigt ud med de 5 stylesheets, har du ikke ved lejlighed tid til at lave en køreklar løsning? -Please :-)
Avatar billede ckh Nybegynder
07. september 2004 - 14:17 #14
En artikel netop om styleswitcher kan du finde her:
http://www.alistapart.com/articles/alternate/

og et fungerende eksempel her:
http://www.alistapart.com/d/relafont/example.html
Avatar billede thesurfer Nybegynder
09. september 2004 - 21:53 #15
- Jeg hopper ud af spm'et.
Avatar billede bugger Nybegynder
09. september 2004 - 22:14 #16
Ja jeg vil godt lige lukke spørgsmålet. Jeg har igennem ckb's link fundet en brugbar løsning og vil derfor gerne have at I der samler på points lægger et svar. Håber at alle er med på en ligelig fordeling.
God vind fremover.
/Buggger
Avatar billede sbm Nybegynder
09. september 2004 - 22:29 #17
Jeg melder pas. :-)
Avatar billede ckh Nybegynder
13. september 2004 - 12:44 #18
:)
Avatar billede Ny bruger Nybegynder

Din løsning...

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.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester