Redimensionner le Logo en fonction de la taille de l'affichage

2 participants

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

Résolu Redimensionner le Logo en fonction de la taille de l'affichage

Message par Cool-84 Dim 30 Mar - 9:41

Bonjour à toutes et tous
Mon problème est relativement simple à énoncer, mais difficile pour moi à régler.
J'ai installé un logo de 1000 px de large en tête du forum, pour qu'il passe un peu partout.
Sur les smartphones, une partie de l'image est amputée, mais bon, au final ce n'est pas trop grave.
Sur les ordi avec une définition de 2014, le logo est nickel, par contre lorsque la définition des ordis est en 1600 alors là, le logo est tout petit.
J'ai cherché sur le FdF une solution, j'ai vu que pour le background il existe une instruction Javascript pour adapter l'image à la définition (en fait chargement d'une image différente en fonction de la définition).
C'est ce que je voudrais faire pour le logo d'entête, mais je n'ai rien trouvé.
Existe t-il aussi un javascript pour le faire
Merci de vos retours


Dernière édition par Cool-84 le Mar 8 Avr - 14:54, édité 1 fois
Cool-84

Cool-84
***

Messages : 117
Inscrit(e) le : 21/06/2011

http://passion-essais.forumactif.org
Cool-84 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Redimensionner le Logo en fonction de la taille de l'affichage

Message par Cool-84 Mer 2 Avr - 14:52

petit UP
il n'y a pas de solution ?
merci 

Smile 
Cool-84

Cool-84
***

Messages : 117
Inscrit(e) le : 21/06/2011

http://passion-essais.forumactif.org
Cool-84 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Redimensionner le Logo en fonction de la taille de l'affichage

Message par Self Jeu 3 Avr - 22:37

Bonjour,

En reprenant le code du tutoriel, on peut essayer comme ça:
Code:
$(function(){

    var logo= "Adresse image (largeur plus grande que 1600px)";

    if(screen.width < 801) logo="Adresse image (largeur 800px)";
    else if(screen.width < 1025) logo="Adresse image (largeur 1024px)";
    else if(screen.width < 1281) logo="Adresse image (largeur 1280px)";
    else if(screen.width < 1601) logo="Adresse image (largeur 1600px)";

    document.getElementById('i_logo').src=logo;

});
Self

Self
Membre actif

Masculin
Messages : 3853
Inscrit(e) le : 13/06/2013

https://selfback.forumactif.com/
Self a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Redimensionner le Logo en fonction de la taille de l'affichage

Message par Cool-84 Ven 4 Avr - 5:30

Merci SeLfde4Th7
Je viens d'essayer, mais çà ne fonctionne pas
A+
Cool-84

Cool-84
***

Messages : 117
Inscrit(e) le : 21/06/2011

http://passion-essais.forumactif.org
Cool-84 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Redimensionner le Logo en fonction de la taille de l'affichage

Message par Self Ven 4 Avr - 14:34

Bonjour,

Peux-tu me montrer quel code tu as mis dans tes javascript exactement ?
L'as-tu bien mis sur toutes les pages ?
Possède tu d'autre javascript et si oui, lesquels ?
Self

Self
Membre actif

Masculin
Messages : 3853
Inscrit(e) le : 13/06/2013

https://selfback.forumactif.com/
Self a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Redimensionner le Logo en fonction de la taille de l'affichage

Message par Cool-84 Ven 4 Avr - 19:21

J'ai repris ton JS et ai inséré les liens des hébergeurs pour les images selon les tailles

$(function(){   
           var logo= "http://www.........................."
           if(screen.width < 801) logo="http://www................................;
           else if(screen.width < 1025) logo="http://www.........................";
           else if(screen.width < 1281) logo="http://........................";
           else if(screen.width < 1601) logo="http://www........................";
         document.getElementById('i_logo').src=logo;    
       });

Oui, j'ai d'autres JS
- espace pour les milliers
- mentions bas de page
- catégories rétractables
- Mention "qui est en ligne"

A+
Cool-84

Cool-84
***

Messages : 117
Inscrit(e) le : 21/06/2011

http://passion-essais.forumactif.org
Cool-84 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Redimensionner le Logo en fonction de la taille de l'affichage

Message par Self Ven 4 Avr - 20:12

Bonjour,

Pardonnez moi, j'ai cru que vous étiez sous phpBB2 et est testé sur mon forum.
Comme cela ça devrait être mieux :
Code:
$(function(){
    var logo= $('#logo img');
    if(screen.width < 801){
        $(logo).attr('src', 'Adresse image (largeur 800px)');
    }else if(screen.width < 1025){
        $(logo).attr('src', 'Adresse image (largeur 1024px)');
    }else if(screen.width < 1281){
        $(logo).attr('src', 'Adresse image (largeur 1280px)');
    }else if(screen.width < 1601){
        $(logo).attr('src', 'Adresse image (largeur 1600px)');
    }else{
        $(logo).attr('src', 'Adresse image (largeur plus grande que 1600px)');
    };
});

Cordialement Smile .
Self

Self
Membre actif

Masculin
Messages : 3853
Inscrit(e) le : 13/06/2013

https://selfback.forumactif.com/
Self a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Redimensionner le Logo en fonction de la taille de l'affichage

Message par Cool-84 Sam 5 Avr - 6:09

Cela marche nickel
Merci SeLfde4Th7, c'était vraiment sympa
A+
Cool-84

Cool-84
***

Messages : 117
Inscrit(e) le : 21/06/2011

http://passion-essais.forumactif.org
Cool-84 a été remercié(e) par l'auteur de ce sujet.

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

- Sujets similaires

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