[EDGE] Installer un selecteur de taille de police

Voir le sujet précédent Voir le sujet suivant Aller en bas

Milouze14
avatar
Fondateur

MessageMilouze14

  • 16px
  • 24px
  • Zoom
Hello les ami(e)s ,

Comme la plupart des scripts viennent du support EDGE, cette dernière restera visible mais un merci sera
toujours apprécié car la traduction a été effectuée par mes soins:

http://fmdesign.forumotion.com/t571-forum-font-size-selector#8979

L'aperçu imagé :



J'ai ajouté le style afin que ce dernier soit en relation avec le thème de couleur sélectionné  clin oeil .

Attention toutefois, si vous n'êtes pas à l'aise avec le script qu'il faudra modifier, merci de passer par l'entraide:

https://www.milouze14.com/f108-entraide-tous-supports

Passons au script du sélecteur de taille de police .


Modules/HTML JAVASCRIPT/Gestion des codes JavascriptCréer un nouveau javascript


Mettez un titre explicite.
Cochez sur toutes les pages.



Déposez ceci:
Code:

$(function() {
          'DEVELOPED BY ANGE TUTEUR';
          'NO DISTRIBUTION WITHOUT CONSENT OF THE AUTHOR';
          'ORIGIN : http://fmdesign.forumotion.com/t571-forum-font-size-selector#8979';
        
          // font sizes
          var sizes = [
            8,
            9,
            10,
            11,
            12,
            13,
            14,
            15,
            16,
            17,
            18,
            19,
            20,
            21,
            22,
            23,
            24
          ],
        
          // position du selecteur
          // 0 = haut de page
          // 1 = bas de page
          position = 0,
          attachTo = '#page-body, #ipbwrapper #content-container',
        
          // language config
          lang = {
            Default : 'Défaut',
            FontSize : 'Taille de police : '
          },
        
        cookie = my_getcookie('fa_fontsize'), // selected font size
 
  selector = $('<select id="fa_fontsize" />')[0], // font size selector
  container = $('<div id="fa_fontsize_container"><span id="fa_fontsize_label" style="font-size:12px">' + lang.FontSize + '</span></div>')[0], // selector container
 
  // options string
  html = '<option value="default:' + window.getComputedStyle(document.body, null).getPropertyValue('font-size') + '" ' + ( /default/i.test(cookie) ? 'selected' : '' ) + '>' + lang.Default + '</option>',
 
  // loop variables
  i = 0, j = sizes.length,
 
  // function for changing the font size
  change = function(init, val) {
    var value = init === true ? val : this.value;
 
    my_setcookie('fa_fontsize', value);
 
    document.body.style.fontSize = /default/i.test(value) ? value.replace(/default:/, '') : value + 'px';
  };
 
  // loop through the sizes array to create an options list for the selector
  for (; i < j; i++) {
    html += '<option value="' + sizes[i] + '" ' + (cookie == sizes[i] ? 'selected' : '') + '>' + sizes[i] + '</option>';
  }
 
  // apply the html and event handler to the selector
  selector.innerHTML = html;
  selector.onchange = change;
 
  // apply the chosen font size if any was selected
  if (cookie) {
    change(true, cookie);
  }
 
  // add the selector to the container and finally the document
  container.appendChild(selector);
  $(attachTo)[['prepend', 'append'][position]](container);
});





Pensez a cliquer sur le bouton Valider



Le thème sera placé en haut de page par défaut, si vous désirez mettre ce dernier en bas de page,
il faudra mettre 1 ici:

position = 0,


Ensuite on va donner un style identique en relation avec le thème de couleur .


Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

En bas de page ajoutez ceci:

Code:

span#fa_fontsize_label{padding:8px 6px;background-color: #69C;color:white !important;top: -1px;position: relative;}
select#fa_fontsize{background-color: #69C;color:white !important;}


Pensez à valider les modifications en cliquant sur le bouton Valider


Passons au sélecteur de couleur ,

Éditez le script suivant en cliquant sur  edit  :

[FA EDGE] ALL.JS

Ligne 252 environ , recherchez ceci:
Code:
.color-primary,

Juste après déposez ceci:
Code:
span#fa_fontsize_label ,select#fa_fontsize,


Pensez a cliquer sur le bouton Valider

Et voilà votre sélecteur aura les couleurs de votre thème super .


Voilà,c'est tout pour le moment.
Un soucis?
Direction l'entraide clin oeil
https://www.milouze14.com/f108-entraide-tous-supports



-Le respect de nos semblables est la règle de notre conduite.-

Fondateur des forums





Voir le sujet précédent Voir le sujet suivant Revenir en haut

Créer un compte ou se connecter pour répondre

Vous devez être membre pour répondre.

S'enregistrer

Rejoignez notre communauté ! C'est facile !


S'enregistrer

Connexion

Vous êtes déjà membre ? Aucun soucis, cliquez ici pour vous connecter.


Connexion

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum