Redimensionnement automatique de l'image si la largeur du navigateur =

Question

J'ai demandé this question aujourd'hui et j'ai obtenu de bonnes réponses (merci aux gars qui m'ont aidé :)).

Maintenant, jetez un coup d'œil au code suivant. Je suis sûr à 100% que la partie redimensionnement fonctionne, mais ma déclaration if/else ne fonctionne pas (je suis toujours une recrue JS). J'ai également mentionné cela dans mon sujet précédent, mais quelqu'un a dit que je devrais plutôt poster une nouvelle question.

(Le script doit détecter la largeur du navigateur de quelqu'un, donc il peut redimensionner le #fluidimage) note: la partie de redimensionnement fonctionne. Seule la détection viewportwidth et l'instruction if/else ne sont pas encore fonctionnelles.

$(window).load (function() { 

    function resizer (index, measurement) { 
     var imageresize = 80; 
     var viewportWidth = width(); 

     if ((viewportWidth >= 1680)) { 
      imageresize = 100; 
     } else if ((viewportWidth <= 1680) && (viewportWidth > 1280)) { 
      imageresize = 80; 
     } else if ((viewportWidth <= 1280) && (viewportWidth > 1024)) { 
      imageresize = 60; 
     } else if ((viewportWidth <= 1024)) { 
      imageresize = 40; 
     } else { 
      imageresize = 100; 
     } 


     this.wCall = (typeof this.wCall == "null") ? true : this.wCall^true; 
     return this.wCall ? Math.round (measurement * imageresize/100) : measurement; 
    } 
    $("#fluidimage").width (resizer).height (resizer); 
}); 

Answer 1

Change:

var viewportWidth = width(); 

Pour:

var viewportWidth = $(window).width(); 

See it at jsFiddle.