Aller au contenu

Rafraichir la CSS


francoisch

Sujets conseillés

Bonjour

Quand ma page se charge, le Head appelle la CSS :


<link rel="stylesheet" type="text/css" href="../style28.php?fontsizemult=1">

en lui passant un multiplicateur de dimensionnement des caractères à afficher, ici = 1.

Je voudrais mettre un bouton qui permette lagrandissement des caractères ; pour ça, jai cette fonction :


<script type="text/JavaScript">
function augmenter()
{
<link rel="stylesheet" type="text/css" href="../style28.php?fontsizemult=1.5">
}
</script>

appelée par un événement onclick pour rappeler la CSS avec un coefficient plus important.

Résultat : à laffichage de la page, jai un message derreur : Erreur de syntaxe.

A votre avis ? Par avance merci de votre aide.

Francois

Lien vers le commentaire
Partager sur d’autres sites

C'est normal : <link ... n'est pas une commande JavaScript.

La solution la moins propre (mais fonctionnelle) serait de faire un

document.write('<link rel="stylesheet" type="text/css" href="../style28.php?fontsizemult=1.5">');

Mais une solution beaucoup plus propre serait d'utiliser le DOM pour supprimer l'ancien appel de CSS, et ajouter le nouveau, toujours dans la balise <head>. Si tu utilises une bibliothèque du style jQuery, c'est relativement facile.

Lien vers le commentaire
Partager sur d’autres sites

Je ne suis pas convaincu par ce type de système pour agrandir la police, tu devrais rester sur les tailles relatives (em, %) pour laisser l'utilisateur agrandir ou réduire sa police à l'aide des fonctionnalités de son navigateur.

C'est déjà prévu, alors pourquoi vouloir le refaire?

Lien vers le commentaire
Partager sur d’autres sites

La plupart des gens ignorent totalement l'existence de ces options :-(

Pour faire juste ce que tu veux, tu peux tenter de rajouter un id à ton <link> original, puis dans ton JS faire un document.getElementById(iddetonlink).href='nouvelleurl' mais je ne suis pas vraiment convaincu que ça marche dans tous les browsers.

Une autre option consiste à avoir une seule taille "de base" (par exemple dans le style du "BODY"), et faire en sorte que dans ton CSS toutes les autres tailles soient calculées à partir de cette taille de base (avec des unités en % ou en "em"). Ensuite tu n'as plus que cette taille-là à changer, pas besoin de recalculer ou recharger tout le CSS pour ça. Et ça a l'avantage que ça marcherait aussi avec les options des navigateurs pour ça.

Jacques.

Lien vers le commentaire
Partager sur d’autres sites

bonjour et merci de vos réponses.

Je vous rassure, mes tailles de caractères sont bien en em pour certains et en % pour les autres.

La difficulté est que mes utilisateurs sont des personnes vraiment âgées à qui je ne peux pas demander de réaliser la manoeuvre habituelle même si elle est simple (pour nous).

Je voudrais juste afficher sur mes pages un bouton disant: Agrandir; ce bouton rafraichirait la CSS, si j'y arrive.

Captain, en essayant avec l'idée du document.write, j'ai en bas de fenêtre un message qui dit: Téléchargement des données http://www.l'url exact qui est dans la commande, et la fenêtre est bloquée là dessus.

Pour ta suggestion d'utiliser le DOM, je n'ai aucune référence là dessus; aurais tu un exemple qui m'aiderait à démarrer?

Merci encore de vos aides.

Francois

Lien vers le commentaire
Partager sur d’autres sites

Même si beaucoup d'utilisateurs ne connaissent pas le CTRL + / CTRL - je ne suis pas pour ces artifices, car justement, ils n'apprendront pas le raccourcis, et se retrouveront vite bloqués sur les autres sites. Pourquoi pas garder un joli picto A+ mais au lieu d'augmenter la taille de la police, envoyer vers une page qui explique le raccourcis? C'est une méthode gagnante pour le site et pour le visiteur, il aura appris justement comment zoomer la page. D'autant qu'avec les navigateurs récent c'est ce qui se passe, ce n'est pas uniquement le texte qui est agrandi, mais toute la page qui l'est.

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...