2016.6.3
サイト制作などで、画像サイズがまちまちなときありますよね。画像サイズが一定よりも小さい時だけに処理がしたい。そういう時に役立つTipsです。
$('img').each(function() { var imageObj = new Image(); imageObj.src = $(this).attr("src"); var imgh = imageObj.height; var addimgClass = parseInt(imgh);//文字列だったら嫌なのでおまじない if(addimgClass < 300) { $(this).addClass('mvg'); } else { $(this).removeClass('mvg'); } });
ひとまず $(‘img’).each(function() で画像を見つけたら全部に対して処理していきます。
var imageObj = new Image(); imageObj.src = $(this).attr("src"); var imgh = imageObj.height;
元画像のsrcを取得し、高さを取得します。
var addimgClass = parseInt(imgh);
ぶっちゃけ数列変換する必要はないんですが、以前詰んだことがあるのでおまじないです。
if(addimgClass < 300) { $(this).addClass('mvg'); } else { $(this).removeClass('mvg'); }
300以下のheightの場合にClassを追加します。
同じ要領で高さじゃなく、横幅を取りに行ってもいいと思います。