增加图像宽度50px

Question

我有一个图像出现多次，但我需要图像宽度增量50px每次出现。

我试过用jQuery来完成这个任务，但是我现在没有运气，任何想法都会出错。

是遍历得到的内容每一位的HTML是：

<div class="hideme"> 
    <h3 class="text-white"><?php the_sub_field('whatcanwedo_stats_number'); ?></h3> 
    <img src="<?php echo get_stylesheet_directory_uri(); ?>/img/tash5.png" alt="tash5" class="what-can-we-do-tash" /> 
    <p><?php the_sub_field('whatcanwedo_stats_content'); ?></p> 
</div> 

而jQuery的我已经是：

var w = 50; 
var newWidth; 
// what can we do tash 
$('.what-can-we-do-tash').each(function(){ 
    newWidth === w; 
    $(this).attr('width',newWidth); 
    w+50; 
}); 

然而，这似乎并没有被做任何事情:(

Answer 1

你应该使用.css()：

$('.what-can-we-do-tash').css('width', function(i){ 
    return $(this).width() + (i * 50); 
}); 

这是工作：http://jsfiddle.net/wDpvV/1/

Answer 2

尝试像

$('.what-can-we-do-tash img').each(function(){ 
    newWidth === w; 
    $(this).css('width',newWidth+50); 
    w+50; 
}); 

或尝试像

$('.what-can-we-do-tash').each(function(){ 
    newWidth === w; 
    $(this).css('width',newWidth+50); //Or directly $(this).width(newWidth+50); 
    w+50;   
}); 

Answer 3

回调的第二个参数是旧的宽度。所以这个作品：

$('.what-can-we-do-tash').width(function(i,width){ 
    return width + i * 50 
});