Hallo

Welkom, Gast. Alsjeblieft inloggen of registreren.

Recent

178 gasten, 0 leden

Welkom, Gast. Alsjeblieft inloggen of registreren.

28 maart 2024, 09:39:36

Login met gebruikersnaam, wachtwoord en sessielengte

Nieuws

Welkom op het vernieuwde NL Computer Forum!

Auteur Topic: In 1 klap grotere letters, hoe doen ze dat?  (gelezen 14639 keer)

0 leden en 1 gast bekijken dit topic.

Offline Ronald

  • Forum Manager
  • *****
  • Berichten: 1.856
  • Geslacht: Man
    • NL Computer Forum
In 1 klap grotere letters, hoe doen ze dat?
« Gepost op: 19 april 2010, 22:44:29 »
Hallo allemaal,

In Firefox, en wellicht in andere browsers ook, kun je de letters op een webpagina eenvoudig vergroten door de Ctrl-toets ingedruk te houden en dan op de + te drukken. Op zich een prima manier, maar niet iedereen is ermee bekend.

Wat ik ook wel op websites tegenkom, is z'n AAA knop, waarmee je dan met 1 klik (en permanent) de letters kunt vergroten. Hoe werkt zoiets?  :-\

Groeten,

Ronald
Forum Manager NL Computer Forum
Microsoft Certified Solutions Expert (MCSE) - Business Intelligence

Offline Michel Uphoff

  • Wizop
  • *****
  • Berichten: 1.816
  • Geslacht: Man
    • Tentoonstelling
Re: In 1 klap grotere letters, hoe doen ze dat?
« Reactie #1 Gepost op: 21 april 2010, 00:30:41 »
Hoi Ronald,
 
Daar zijn een heleboel technieken voor. Een veelgebruikte (en m.i. beste) mogelijkheid is te werken met een CSS dat een globale fontgrootte zet. Op basis van wat javascript dat via linkjes (AAA) de juiste CSS met groter (of kleiner) font activeert, én een cookie die de gekozen instelling bewaart moet dat netjes en vriendelijk te doen zijn.
 
Hier wat meer info (over een iets ander onderwerp, maar de strekking is hetzelfde): http://www.thesitewizard.com/javascripts/change-style-sheets.shtml
Michel Uphoff
Homepage

Offline FOX Creation

  • Net nieuw
  • *
  • Berichten: 23
  • Geslacht: Man
    • FOX Creation :: Webdesign
Re: In 1 klap grotere letters, hoe doen ze dat?
« Reactie #2 Gepost op: 27 april 2010, 17:03:18 »
Beste Ronald,

Zoals Michel al zei is dit het aanspreken van een ander CSS bestandje.
Daarnaast werkt de functie die jij bedoeld van Ctrl + '+' met een website die in de CSS:
font-size: +2
gebruikt. Daar moet de font-size 2x groter zijn dan de standaard instelling van de browser.
Met Ctrl + '+' kun je die standaard instelling aanpassen. Echter werkt dat tegenwoordig ook zonder die speciale code.

De site wordt dan 'ingezoomd' als het ware.
Een mogelijke code die ik gebruikt het voor het veranderen van de gehele site kleur is:

<?php
//Kleur stylesheet
if(!empty($_GET['k'])){
switch($_GET['k']) {
default:
$colour="orange";
exit;
break;

case 'p':
$colour="pink";
break;
case 'b':
$colour="black";
break;
case 'o':
$colour="orange";
}
}
elseif(isset($_COOKIE['website-kleur'])){
$colour=$_COOKIE['website-kleur'];
}
else{
$colour "orange";
}
setcookie('website-kleur'$colourtime() +3600);
?>


<html ....>       
<head>
 <LINK rel="stylesheet" type="text/CSS" href="styles/css.css">
<LINK rel="stylesheet" type="text/CSS" href="styles/<?php echo $colour?>.css">
</head>
<body>
<?php 
if(!empty($_SERVER['QUERY_STRING'])){
if(isset($_GET['k'])){
$var="&"$_SERVER['QUERY_STRING'];
$vars=substr($var,4); 

else{
         
$vars="&"$_SERVER['QUERY_STRING'];
}
}
else{ 
$vars=""; }
?>

<a href="<?php echo $_SERVER['PHP_SELF']; ?>?k=b<?php echo $vars?>" ><img src="img/black.jpg" alt="Zwart" title="Verander de site kleur naar zwart"></a>

Hierbij controleer ik dus per pagina welke kleur gebruikt is, hiervoor gebruik ik eveneens Cookies zoals Michel al zei.
Verder heb ik een standaard CSS sheet zodat je niet altijd alle sheets langs moet. Enkel de variabele gegevens.

In de body controleer ik of er al 'query's' aanwezig zijn in de URL.

Ik hoop dat je er wat aan hebt.

Met vriendelijke groeten,

Reinier
FOX Creation :: Webdesign
www.fox-creation.nl

Offline Ronald

  • Forum Manager
  • *****
  • Berichten: 1.856
  • Geslacht: Man
    • NL Computer Forum
Re: In 1 klap grotere letters, hoe doen ze dat?
« Reactie #3 Gepost op: 27 april 2010, 23:28:34 »
Hoi Michel en Reinier,

Hartelijk dan voor jullie tips! Ik ga ermee aan de slag om dit ook op dit Forum mogelijk te maken. :D

Reinier: moet zoiets per se met een cookie, of zou opslaan van de gebruikersvoorkeur in een database ook goed kunnen werken? (Dit Forum draait ook onder php/mysql).

Groeten,

Ronald
Forum Manager NL Computer Forum
Microsoft Certified Solutions Expert (MCSE) - Business Intelligence

Offline FOX Creation

  • Net nieuw
  • *
  • Berichten: 23
  • Geslacht: Man
    • FOX Creation :: Webdesign
Re: In 1 klap grotere letters, hoe doen ze dat?
« Reactie #4 Gepost op: 29 april 2010, 18:28:36 »
Ronald,

naar mijn weten werkt het bij dit forum al. Al is het misschien wat ongecontroleerd, omdat het door de browser zelf wordt gedaan. Je zou dan wel echt een AAA systeem moeten gebruiken.

Uiteraard is het ook mogelijk met de PHP MySQL gegevens.
De code zou dan bijv worden:

<?php
//Kleur stylesheet
   
if(!empty($_GET['k'])){         
      switch(
$_GET['k']) {
      default:   
            
$colour="orange";
            exit;
            break;

      case 
'p':   
            
$colour="pink";
            break;
      case 
'b':
            
$colour="black";
            break;
      case 
'o':
            
$colour="orange";
      }
   }
   elseif(
db_connection()){    // moet je even kijken of je een functie hebt die verbinding met db maakt.   
      
$color_in_db mysql_fetch_array(mysql_query("SELECT colour FROM [TABLE] WHERE [GEBRUIKER] = [NAAM]"));
      
$colour=$color_in_db[0];
   }
   
$query="UPDATE [TABLE] SET colour = "$colour ." WHERE [GEBRUIKERS ID/NAAM] = '[GEBRUIKERS ID/NAAM]'";
      
//vb : UPDATE gebruikersgegevens SET colour = ". $colour ." WEHERE gebruikersnaam = 'reinier'";
   
mysql_query($query);
?>

Je zult hem wel enigszins moeten aanpassen, weet niet 100% of het werkt, maar dit is wel een goede aanzet denk ik zo.

Ik hoor graag of het gelukt is.
Je kunt colour natuurlijk aanpassen naar size.

MVG
Reinier
FOX Creation :: Webdesign
www.fox-creation.nl

Offline Ronald

  • Forum Manager
  • *****
  • Berichten: 1.856
  • Geslacht: Man
    • NL Computer Forum
Re: In 1 klap grotere letters, hoe doen ze dat?
« Reactie #5 Gepost op: 2 mei 2010, 16:26:08 »
Hoi Reinier,

Ik vind die Ctrl++ optie persoonlijk erg goed werken, maar dat valt dus niet achter een knop te zetten? Of is het sowieso geen goed idee, omdat andere browsers er een potje van maken. :D

Dank voor de voorbeeldcode! Ik begin het al enigszins te snappen... Wat ik nog vooral lastig vind, is te bepalen hoe ik nu het eenvoudigst het 'Ctrl++' effect kan krijgen, zonder dat ik veel in de huidige stylesheets moet gaan grasduinen. Want die zijn érg lang, en op veel plekken staat dus iets over font grootten.  :-\

Helemaal bovenin staat trouwens dit:

body {font:13.2px/140%   Tahoma,sans-serif;}
Van dat px, pt, em enzovoort snap ik nog niet zo veel.  ??? Ik kan dat 13.2px wel groter maken, maar dan gaat de helft van het Forum mee, en de andere helft weer niet.  :-\

Groeten,

Ronald
Forum Manager NL Computer Forum
Microsoft Certified Solutions Expert (MCSE) - Business Intelligence

Offline FOX Creation

  • Net nieuw
  • *
  • Berichten: 23
  • Geslacht: Man
    • FOX Creation :: Webdesign
Re: In 1 klap grotere letters, hoe doen ze dat?
« Reactie #6 Gepost op: 2 mei 2010, 16:58:32 »
Ronald,

De codering voor de tekstgrootte heb ik zelf nooit gebruikt, wat em inhoud is:
Citaat van: Gigadesign.be
Werken met em  Om gemakkelijk met em te kunnen werken moet je een standaard waarde   maken voor je tekst, dus normaal is bij elke browser 16px   de standaard waarde, nu gaan we deze gemakklijkshalve naar 10px   brengen door:
16px - 62.5% = 10px
body {font-size:62.5%}
Zo nu is alles 10px, en met alles bedoel ik ook alles,   zelfs h1 tot h6 etc…, dus vanaf nu is 1em   = 10px
 
  • 0.8em = 8px
  • 1em = 10px
  • 1.2em = 12px
  • 2em = 20px
  • etc…

Wat je kunt doen is door de CSS heen lopen met de Ctrl F toets. Iedere header met:
font-size
erin kun je dan eruit halen en bijv in normal-text.css plaatsen.
Die kopieer je letterlijk naar small-text.css en daar haal je overal bijv. 10% van af. OF welke waarde je wilt.
Zo kun je verder werken.

Ik denk dat dat de beste optie is..

Succes
Reinier
FOX Creation :: Webdesign
www.fox-creation.nl

Offline fortron

  • Net nieuw
  • *
  • Berichten: 44
  • Geslacht: Man
    • Stichting KUBES, kunst en cultuur voor blinden en slechtzienden
Re: In 1 klap grotere letters, hoe doen ze dat?
« Reactie #7 Gepost op: 2 mei 2010, 20:49:09 »
Vroeger bood ik ook een dergelijke manier van vergroten aan, maar ik laat het sinds een aantal jaren liever over aan de webbrowser, die is daar beter in.