Question

I get with Mechanize a array with every images from a web page with this code:

url = http://www.cnn.com
page = Mechanize.new.get(url)
@images_urls = page.images.map{|img| img.url.to_s }.compact

and I get in my view this images with a block:

<div class="preview">
<% @images_urls.each do |image_url| %>
 <%=  image_tag "#{image_url}" %>
<% end %>
</div>

This array generate urls like e.g.:

<img src="http://i2.cdn.turner.com/cnn/dam/assets/120226120954-mandela-paper-t1-main.jpg" alt="120226120954-mandela-paper-t1-main">
<img src="http://i2.cdn.turner.com/cnn/dam/assets/120226120954-mandela-paper-t1-main.jpg" alt="120226120954-mandela-paper-t1-main">
<img src="http://i.cdn.turner.com/cnn/.e/img/3.0/global/icons/video_icon.gif" alt="Video_icon">
.
.
.

I need a code for remove images less 50px in height and width, then I get

$('.preview img').load(function() {
   var $img = $(this);
   alert ($img.width());
   if ($img.height() < 50 || $img.width() < 50) {
       $img.remove();
   }  
});

I get in alert ($img.width()); the value 0 for every images…So remove every images for this condition.

The images have values ​​greater than zero 0!!

Why?

Edited Problem Fixed

The problem is that I’m using Fancybox and the code goes after Fancybox callback

onComplete

Thank you Rob W

Answer 1

Try this snippet for determine if the image was loaded, Here ..