Friday 15 April 2011

javascript - Change an img height so it's at a certain aspect ratio to it's width with jQuery -



javascript - Change an img height so it's at a certain aspect ratio to it's width with jQuery -

i have image need alter dimensions of jquery. image width should same width of it's parent div. parent div responsive column container, it's width dynamic(fluid). 1 time width of image changed, height should changed value correspond aspect ratio of 16:9 in relation image's width. let's column width 1920... image height 1080. how can modify code this?

$(document).ready(function(){ $('#featured-articles').find('.featured').each(function(){ var slide = $(this); $(this).find('img[rel="featured_preview"]').each(function(){ var new_width = slide.width(); var new_height = ????? $(this).prop("width", new_width).prop("height", new_height); }); }); }); <div id="featured-articles"> <div class="featured"> <img src="slide.jpg" rel="featured_preview"> </div> <div class="featured"> <img src="slide2.jpg" rel="featured_preview"> </div> </div>

i haven't tested code, want?

var new_height = math.round(new_width*9/16);

javascript jquery html css

No comments:

Post a Comment