javascript - Get the height of image of 100% width -

i trying image height of width of 100% browser's width.

$(document).ready(function(){     var heightimage = $('ul.images img').height();     $('ul.images').css("height", heightimage + "px"); }); 

the problem code above when resize browser, , height of images of 100% widths changes, heightimage doesn't change.

so decide use:

$(window).resize(function(){     var heightimage = $('ul.images img').height();     $('ul.images').css("height", heightimage + "px"); }); 

there 2 problem code above:

the image in absolute position. display block, , sometime display none. catch image height before image fadein show slideshow. changes height of image when browser size changed. if resize browser when image fading, while images display none, catch height of image 0px.

and second problem of code detects height of image when browser size changes.

can please give me alternative how catch height of images on slideshow width of 100% + on browser resize?

thanks in advance.

my html code

<ul class="images">    <li><img src="1.jpg" /></li>    <li><img src="2.png" /></li>    <li><img src="3.jpg" /></li>    <li><img src="4.jpg" /></li> </ul> 

i copy pasted code somewhere around here:

var triggers = $('ul.triggers li'); var images = $('ul.images li'); var lastelem = triggers.length-1; var target;  triggers.first().addclass('active'); images.hide().first().show();  function sliderresponse(target) {     images.fadeout(500).eq(target).fadein(500);     triggers.removeclass('active').eq(target).addclass('active'); }  triggers.click(function() {     if ( !$(this).hasclass('active') ) {         target = $(this).index();         sliderresponse(target);         resettiming();     } });  $('.next').click(function() {     target = $('ul.triggers li.active').index();     target === lastelem ? target = 0 : target = target+1;     sliderresponse(target);     resettiming(); }); $('.prev').click(function() {     target = $('ul.triggers li.active').index();     lastelem = triggers.length-1;     target === 0 ? target = lastelem : target = target-1;     sliderresponse(target);     resettiming(); });  function slidertiming() {     target = $('ul.triggers li.active').index();     target === lastelem ? target = 0 : target = target+1;     sliderresponse(target); }  var timingrun = setinterval(function() { slidertiming(); },5000); function resettiming() {     clearinterval(timingrun);     timingrun = setinterval(function() { slidertiming(); },5000); } 

do this:

var heightimage = $('ul.images img').height(); $(window).resize(function(){     heightimage = $('ul.images img').height();     $('ul.images').css("height", heightimage + "px"); }).resize();