Do jQuery's height() and width() methods maintain an image's proportionality?
Google results and the jQuery documentation indicate that jQuery's height() and width() methods make no effort to maintain an element's proportionality.
Yet when I run my code, it appears as if proportionality is indeed maintained.
Can anyone set the record straight?
Here's my code:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js" type="text/javascript"></script>
<script src="jquery.gallery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('img').gallery();
});
</script>
</head>
<body>
<img src="img1.jpg" alt="" />
<img src="img2.jpg" alt="" />
<img src="img3.jpg" alt="" />
</body>
</html>
jquery.gallery.js
(function( $ ){
$.fn.gallery = function() {
return this.each(function() {
var e = $(this);
e.height(128);
}开发者_如何学运维);
};
})( jQuery );
jQuery does indeed do nothing to maintain the proportions of the image. If you set only the width or only the height of an image, it will automatically maintain it's proportions.
If you set only the height of an image, the width is adjusted in proportion and vice versa. Proportionality is not maintained if you set both of them.
加载中,请稍侯......
精彩评论