Membres connectés récemment
[EDGE] Taille de police dans les sujets et zoom
2 participants
Page 1 sur 1 • Partagez
Hi,
J'ai appliqué la méthode donnée par Philippe dans ce tuto
Cela ne donne pas l'effet escompté sur mon forum test, seul le bouton de zoom apparaît et en zoomant le texte, ce dernier apparaît bien en gros, la lecture est plus compliquée. Et impossible de revenir à l'affichage par défaut autrement qu'en rafraichissant la page, il manque la petite croix de fermeture, comme sur ce fora
En image
Capture d'écran d'un post
Capture d'écran avec zoom
Je ne pense pas avoir merdé en inscrivant les codes, pas de bouton pour augmenter la taille de police
Quel est le problème ?
Par avance merci
Lien du message sur le forum test :
http://edge.forumactif.com/t16-bla-bla-avec-code-pour-tester-la-taille-de-police-et-le-zoom#28
J'ai appliqué la méthode donnée par Philippe dans ce tuto
Cela ne donne pas l'effet escompté sur mon forum test, seul le bouton de zoom apparaît et en zoomant le texte, ce dernier apparaît bien en gros, la lecture est plus compliquée. Et impossible de revenir à l'affichage par défaut autrement qu'en rafraichissant la page, il manque la petite croix de fermeture, comme sur ce fora
En image
Capture d'écran d'un post
Capture d'écran avec zoom
Je ne pense pas avoir merdé en inscrivant les codes, pas de bouton pour augmenter la taille de police
Quel est le problème ?
Par avance merci
Lien du message sur le forum test :
http://edge.forumactif.com/t16-bla-bla-avec-code-pour-tester-la-taille-de-police-et-le-zoom#28
Hello Fred,
tu peux remplacer le script par celui-ci:
Puis, on va déposer le style dans le template.
Dans le template viewtopic_body:
Affichage/Templates/Général/viewtopic_body
Ajoutes ceci:
Penses à enregistrer puis à valider en cliquant respectivement sur Enregistrer puis
Tu peux personnaliser le conteneur , exemple avec les balises codes:
tu peux remplacer le script par celui-ci:
- Code:
$(document).ready(function () {
$('.M14_Zoom').click(function(){
$(this).unbind();
$('body').append('<div id="M14_Zoom"class="color-primary"style="display:none;position: fixed;z-index:999;width:80%;height:auto;max-height: 390px;min-height: 80px;top: 25%;left:10%;">
<div id="M14_ZoomClose"class="color-primary"title="Fermer cette boite de dialogue."></div>
<div class="M14_ZoomCont" style="height:auto;max-height: 380px;min-height: 80px;overflow-y: auto;padding:5px;color:#fff;font-size:24px;word-wrap: break-word;"></div></div>');
var h=$(this).closest('.postbody').find('.content div').html();
$('.M14_ZoomCont').html(''+h+'');
$('#M14_Zoom').show();
// start tooltipster
$('#M14_ZoomClose').tooltipster({
animation : 'fade',
arrow : true,
speed : 300,
delay : 300,
onlyOne : true,
theme : 'tooltipster-default'
});
});
$('#M14_ZoomClose').live( "click", function() {$(this).closest('#M14_Zoom').fadeOut();});
});
Puis, on va déposer le style dans le template.
Dans le template viewtopic_body:
Affichage/Templates/Général/viewtopic_body
Ajoutes ceci:
- Code:
#M14_ZoomClose{
text-align: center;
cursor: pointer;
width: 32px;
height: 32px;
position: absolute;
margin-top: -30px;
left: 95%;
-webkit-border-radius: 60px;
-moz-border-radius: 60px;
border-radius: 60px;
}
#M14_ZoomClose:before
{
font-family: FontAwesome;
content: "\f00d";
color: #fff;
top: 10px;
position: relative;
}
Penses à enregistrer puis à valider en cliquant respectivement sur Enregistrer puis
Tu peux personnaliser le conteneur , exemple avec les balises codes:
- Code:
.M14_ZoomCont dl.codebox{background-color:white;}
Super merci, le code du template avec la balise style :
- Code:
<li id="M14_btnFontSize"class="M14_Zoom"style="cursor:pointer;line-height: 14px;height: 14px;padding:2px 3px;font-size:12px;"title="Zoomer le message">Zoom</li>
<style>
#M14_ZoomClose{
text-align: center;
cursor: pointer;
width: 32px;
height: 32px;
position: absolute;
margin-top: -30px;
left: 95%;
-webkit-border-radius: 60px;
-moz-border-radius: 60px;
border-radius: 60px;
}
#M14_ZoomClose:before
{
font-family: FontAwesome;
content: "\f00d";
color: #fff;
top: 10px;
position: relative;
}
</style>
Oups la, autant pour moi,
dans ce template,
recherches ceci:
Juste après déposes ceci:
Penses à enregistrer puis à valider en cliquant respectivement sur Enregistrer puis
dans ce template,
recherches ceci:
- Code:
<li>{postrow.displayed.REPORT_IMG_NEW}</li>
Juste après déposes ceci:
- Code:
<li class="M14_Zoom"style="cursor:pointer;color:#ffffff !important;line-height: 14px;height: 14px;padding:2px 3px;font-size:12px;"title="Zoomer le message">Zoom</li>
Penses à enregistrer puis à valider en cliquant respectivement sur Enregistrer puis
Hum, je comprend , tu es resté avec le lien de l'astuce.
En faite, lorsque tu mentionnes ceci:
https://www.milouze14.com/t31700-edge-taille-de-police-dans-les-sujets-et-zoom#602621
je comprends que tu as déposé juste avant le style , ce code html:
En faite, lorsque tu mentionnes ceci:
https://www.milouze14.com/t31700-edge-taille-de-police-dans-les-sujets-et-zoom#602621
je comprends que tu as déposé juste avant le style , ce code html:
- Code:
<li id="M14_btnFontSize"class="M14_Zoom"style="cursor:pointer;line-height: 14px;height: 14px;padding:2px 3px;font-size:12px;"title="Zoomer le message">Zoom</li>
Sujets similaires
Créer un compte ou se connecter pour répondre
Vous devez être membre pour répondre.
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum