5

アップロード後にサムネイルとしてレンダリングされる画像のリストがあります。私が抱えている問題は、サイズが正しくない場合にサイズ変更機能を実行できるように、完全にアップロードされた画像のサイズが必要なことです。

画像リストを構築する関数

function buildEditList(json, galleryID)
{
    //Hide the list
    $sortable = $('#sortable');
    $sortable.hide();

    for(i = 0, j = json.revision_images.length; i < j; i++) {
        $sortable.append(
            "<li id='image_" + json.revision_images[i].id + "'><a class=\"ui-lightbox\" href=\"../data/gallery/"
            + galleryID
            + "/images/album/"
            + json.revision_images[i].OrgImageName
            + "\"><img id=\""
            + json.revision_images[i].id
            + "\" alt=\"\" src=\"../data/gallery/"
            + galleryID 
            + "/images/album/" 
            + json.revision_images[i].OrgImageName 
            + "\"/></a></li>"
        ).hide();
    }
    //Set first and last li to 50% so that it fits the format
    $('#sortable li img').first().css('width','50%');
    $('#sortable li img').last().css('width', '50%');

    //Fade images back in 
    $sortable.fadeIn("fast",function(){
        var img = $("#703504"); // Get my img elem -- hard coded at the moment
        var pic_real_width, pic_real_height;
        $("<img/>") // Make in memory copy of image to avoid css issues
            .attr("src", $(img).attr("src"))
            .load(function() {
                pic_real_width = this.width;   // Note: $(this).width() will not
                pic_real_height = this.height; // work for in memory images.
        });
        alert(pic_real_height);
    });

}

このスタックオーバーフローの投稿のソリューションを使用しようとしていますが、まだ機能していないか、私のコードである可能性があります。これについて何かアイデアがあれば、私は助けを使うことができます. 現在、アラートは未定義で戻ってきています。

4

1 に答える 1

2

探している情報を返す、naturalHeightまたはnaturalWidthと呼ばれる新しいjsメソッドがあります。残念ながら、古いバージョンのIEでは機能しません。これが私が数ヶ月前に作成した関数で、あなたのために働くかもしれません。例として、その下にコードを少し追加しました。

function getNatural($mainImage) {
    var mainImage = $mainImage[0],
        d = {};

    if (mainImage.naturalWidth === undefined) {
        var i = new Image();
        i.src = mainImage.src;
        d.oWidth = i.width;
        d.oHeight = i.height;
    } else {
        d.oWidth = mainImage.naturalWidth;
        d.oHeight = mainImage.naturalHeight;
    }
    return d;
}

var img = $("#703504");
var naturalDimension = getNatural(img);
alert(naturalDimension.oWidth, naturalDimension.oHeight)​
于 2012-12-13T00:20:59.093 に答える