Texte différent sur version mobile et web
Résolu
tiran58
Messages postés
59
Date d'inscription
Statut
Membre
Dernière intervention
-
animostab Messages postés 2829 Date d'inscription Statut Membre Dernière intervention -
animostab Messages postés 2829 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
J'aimerai savoir si il et possible de mettre un text différent en fonction du css
Exemple :
Titre version pc : comment ça marche
Titre version mobile : c-ç-m
si oui comment faire ?
merci d'avance
J'aimerai savoir si il et possible de mettre un text différent en fonction du css
Exemple :
Titre version pc : comment ça marche
Titre version mobile : c-ç-m
si oui comment faire ?
merci d'avance
A voir également:
- Texte différent sur version mobile et web
- Web office - Guide
- Dernière version ccleaner gratuit français - Télécharger - Nettoyage
- Splitcam ancienne version - Télécharger - Messagerie
- Chaine tnt gratuite sur mobile - Guide
- Traducteur photo - texte et web - Guide
2 réponses
salut
sinon en javascript tu peux faire ca (ne prend pas en charge le redimensionnement) donc reduire et actualiser pour vérifier
sinon il y la solution suivante en ecrivant 2 fois le texte et cacher la version non désirée avec les class (mob ecran inférieur à 600px et nonmob supérieur à 600px)
Un petit merci vaut mieux qu'une grande ignorance !
Donc si votre sujet est résolu une réponse avec merci c'est pas de refus.
sinon en javascript tu peux faire ca (ne prend pas en charge le redimensionnement) donc reduire et actualiser pour vérifier
<p id="change">ecran plus grand de 600 px</p>
<script>
var w = document.documentElement.offsetWidth;
var elem = document.getElementById("change");
if ( w < 600 ) { elem.innerHTML="ecran plus petit que 600px";}
</script>
sinon il y la solution suivante en ecrivant 2 fois le texte et cacher la version non désirée avec les class (mob ecran inférieur à 600px et nonmob supérieur à 600px)
<p class="mob">ecran plus petit que 600 px</p>
<p class="nonmob">ecran plus grand que 600 px</p>
<p class="mob">version mobile</p>
<p class="nonmob">version ordinateur</p>
<p> Ici le texte pour toutes les versions</p>
<script>
var w = document.documentElement.offsetWidth;
var mobile = document.getElementsByClassName("mob");
var nonmobile = document.getElementsByClassName("nonmob");
if (w > 600) {for(var i = 0; i < mobile.length; i++) {
mobile[i].style.display = 'none';
}}
else {for(var i = 0; i < nonmobile.length; i++) {
nonmobile[i].style.display = 'none';
}}
</script>
Un petit merci vaut mieux qu'une grande ignorance !
Donc si votre sujet est résolu une réponse avec merci c'est pas de refus.
.mobile {display:none;} .nonmobile {display:block;} @media screen and (max-width: 600px){ .mobile {display:block;} .nonmobile {display:none;} }(lien codepen)
la solution que je donne permet le referencement du texte
prosthetiks utilise un ::before dans le css pour rajouter le texte (donc pas référencé)
moi le texte est dans le html et display none ou block suivant le max-width en media queries
genre
évidement en faisant attention au keyword stuffing