开发者

how to get dynamically created elements width and apply style to that?

开发者 https://www.devze.com 2023-01-01 08:03 出处:网络
I am creating an li element dynamically like this: $(data).find(\'slide\').each(function(numSlide){ var slideLink = $(this).attr(\'link\');

I am creating an li element dynamically like this:

$(data).find('slide').each(function(numSlide){
  var slideLink = $(this).attr('link');
  var slideimage = $(this).children('slideimage').text();
  var slidedesc = $(this).children('slidedesc').text();

  $('.slider ul').append('<li><a href="'+slideLink+'"><img src="'开发者_如何学Go+root+"images/top-slider-image/"+slideimage+'" alt="welcome to Burger Davis Blog" /></a><div class="note">'+slidedesc+'</div></li>');
})

But I'd like to calculate the width of the li, and I need to apply some style to it -- how can I do that? If I add styles via the css method, it does not work for dynamically created elements...

Please help me to get dynamic elements' width and how to apply styles into that?

I know we can use the live function, but I can't get even by that..


$(data).find('slide').each(function(numSlide){
  var slideLink = $(this).attr('link');
  var slideimage = $(this).children('slideimage').text();
  var slidedesc = $(this).children('slidedesc').text();
  var li = $('<li><a href="'+slideLink+'"><img src="'+root+"images/top-slider-image/"+slideimage+'" alt="welcome to Burger Davis Blog" /></a><div class="note">'+slidedesc+'</div></li>');
  $('.slider ul').append(li);
  var w = li.outerWidth();
  li.css('width', w + 100);
})

This is a contrived sample. create the link outside the append so you can access it directly and utilize either innerWidth() or outerWidth() to get the width value. Then just reference the css function of the item you create. In this example I just take the current width and add 100 to it.


The width of an element, once it has been added to the DOM, is

element.offsetWidth
0

精彩评论

暂无评论...
验证码 换一张
取 消