2009-11-15 5 views
2

Le code ci-dessous fonctionne très bien pour redimensionner une image par rapport hauteur/hauteur et je peux également créer une fonction séparée par largeur. Mais je ne suis pas toujours sûr si une image devra être rétrécie par la hauteur ou la largeur. Par exemple, si l'espace dans lequel l'image doit être redimensionnée est 100 largeur et 100 hauteur et une image est 150 par 90, alors c'est la largeur qui aurait besoin d'être rétrécie. Si l'image est de 80 sur 160, la hauteur devra être réduite. Donc, ce que je demande, c'est comment le code ci-dessous peut-il être modifié afin de réduire une image par rapport d'aspect pour s'adapter aux paramètres de largeur et de hauteur? Merci.Redimensionnement d'une image

jQuery.fn.resizeHeightMaintainRatio = function(newHeight){ 
if (this.aspectRatio == undefined) 
this.aspectRatio = parseInt($(this).width()/$(this).height()); 
$(this).height(newHeight); 
$(this).width(newHeight * this.aspectRatio); 
} 

J'ai encore modifié le code, car à la suite d'une inspection plus approfondie, ni ma version mise à jour ni Dan ne semblaient fonctionner correctement. Le rapport d'aspect a été perdu alors voici encore un autre. Je l'ai essayé sur une image et jusqu'ici tout va bien. Ici, il est,

 jQuery.fn.resizeMaintainRatio = function(newHeight, newWidth){ 
      widthRatio = parseInt($(this).width()/newWidth); 
      heightRatio = parseInt($(this).height()/newHeight); 

      if(heightRatio > widthRatio) 
      { 

       this.aspectRatio = parseInt($(this).css("width")/$(this).css("height")); 

       $(this).css("height", newHeight); 
       $(this).css("width", newHeight * this.aspectRatio); 

      } 
      else{ 

       this.aspectRatio = parseInt($(this).css("height")/$(this).css("width")); 

       $(this).css("width", newWidth); 
       $(this).css("height", newWidth * this.aspectRatio); 

      } 

     } 

NOTE DE NOUVEAU: après plus utiliser le code ci-dessus fonctionne très étrangement, essayez cette place - http://plugins.jquery.com/project/kepresize

+0

Ne pas oublier d'enlever cette ligne: * if (this.aspectRatio == undefined) * –

Répondre

3

Le code suivant déterminera quel côté doit être mis à l'échelle (fonctionne avec des cases non carrées, qui vérifient simplement la largeur et la hauteur ne fonctionneront pas) et met à l'échelle en fonction de cela.

Il agrandira également l'image si elle est plus petite que la boîte newWeight * newHeight. Si vous ne voulez pas qu'il s'agrandisse, où je change les rapports, vérifiez si la largeur OU la hauteur est> 1 alors et alors seulement faites l'échelle. Clause de non-responsabilité: Le code n'a pas été exécuté, mais le concept doit être correct.

EDIT Mise à jour avec les correctifs de l'OP.

jQuery.fn.resizeHeightMaintainRatio = function(newHeight, newWidth){ 
    widthRatio = parseInt($(this).width()/newWidth); 
    heightRatio = parseInt($(this).height()/newHeight); 
    if(widthRatio < 1 && heightRatio < 1){ 
     widthRatio = heightRatio; 
     heightRatio = widthRatio; 
    } 
    if(widthRatio > heightRatio){ 
     $(this).width(newWidth); 
     $(this).height(newHeight/widthRatio); 
    } else 
    { 
     $(this).height(newHeight); 
     $(this).width(newWidth/heightRatio); 
    } 
} 
+0

J'ai effectué les erreurs sur mais il ne fonctionne toujours pas. – usertest

+0

A propos de résoudre le problème maintenant: Ne jamais essayer de coder tout en faisant des choses pour votre femme. Ça ne marche pas :) –

+0

Peu importe, j'ai vu que tu l'as fait. :) Je vais mettre à jour quand même –

1

Il faudrait vérifier $(this).width() > $(this).height() Lorsque vrai, appelez le Largeur- version de ce code, sinon appeler cette version exacte.

0

Il n'y a pas de compte pour la quantité de copie et de pasters là-bas hein! Je voulais aussi savoir ceci et tout ce que j'ai vu étaient des exemples sans fin de largeur d'écartement OU de hauteur ... qui voudrait que l'autre déborde ?! aspect

  • largeur Redimensionner et la hauteur sans la nécessité d'une boucle
  • ne dépasse pas les images dimensions originales
  • Utilise les mathématiques qui fonctionne correctement à-dire largeur/aspect pour la hauteur et la hauteur * pour la largeur pour que les images sont effectivement mis à l'échelle correctement et vers le bas:/

doit être droit assez avant de convertir en javascript ou d'autres langues

//////////////

private void ResizeImage(Image img, double maxWidth, double maxHeight) 
{ 
    double srcWidth = img.Source.Width; 
    double srcHeight = img.Source.Height; 

    double resizeWidth = srcWidth; 
    double resizeHeight = srcHeight; 

    double aspect = resizeWidth/resizeHeight; 

    if (resizeWidth > maxWidth) 
    { 
     resizeWidth = maxWidth; 
     resizeHeight = resizeWidth/aspect; 
    } 
    if (resizeHeight > maxHeight) 
    { 
     aspect = resizeWidth/resizeHeight; 
     resizeHeight = maxHeight; 
     resizeWidth = resizeHeight * aspect; 
    } 

    img.Width = resizeWidth; 
    img.Height = resizeHeight; 
} 
Questions connexes