BullGuard Antivirus Sale - 60% Off with openElement !
Accueil Forum Accueil Forum >

openElement

> Tutoriaux utilisateurs
  Nouveaux messages Nouveaux messages Fil RSS  - [Tuto] le visiteur change la taille des textes
  FAQ FAQ  Rechercher dans le Forum   Inscription Inscription  Connexion Connexion

[Tuto] le visiteur change la taille des textes

 Répondre Répondre
Auteur
Message
Hobby001 allez vers le bas
Admin Group
Admin Group
Avatar
Modérateur

Depuis le: 14 Feb 2015
Pays: Canada, Québec
Status: Inactif
Points: 6507
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer Hobby001 Citer  RépondreRéponse Lien Direct à ce Post Sujet: [Tuto] le visiteur change la taille des textes
    Envoyé : 01 Mar 2020 à 20:38
Bonjour voici une marche à suivre pour permettre au visiteur de changer la taille des différents textes de la page.

Créez deux éléments qui serviront de déclencheurs.  Ces déclencheurs auront les classes CSS personnalisées suivantes:  "textePlus"  et  "texteMoins"

Ajoutez le code javascript suivant en position Enbody: 

$(function(){

// boutons de changement de taille du texte incréments de 10% 

$('.textePlus').click(function(){
changeSize(10);
});

$('.texteMoins').click(function(){
changeSize(-10);
});

// Changement de la taille
function changeSize(deltaPercent){ // "Noter" la taille d'origine, peu importe d'ou elle provient, puis modifier-la
$('.OESZ').each(function(){
var $el = $(this);
if (!$el.data('oe_orig_size')) { // jamais affecte - memoriser la taille d'origine
$el.data('oe_orig_size', $el.css('font-size'));
$el.data('oe_size_coef', 1.0);
}
$el.data('oe_size_coef', $el.data('oe_size_coef') + deltaPercent*0.01);
$el.css('font-size', 
(parseFloat($el.data('oe_orig_size')) * $el.data('oe_size_coef')) + 'px');
});
}
});

Notex que dans ce code la valeur changeSize(10) donne un incrément de 10%.
Haut de la page
 Répondre Répondre
  Partagez ce sujet   

Aller au Forum Permissions du forum allez vers le bas

Forum Software by Web Wiz Forums® version 12.04
Copyright ©2001-2021 Web Wiz Ltd.

Cette page a été affichée en 0.047 secondes.