2011-01-27 6 views
1

Hey Guys。 これは本当に難しい質問ではなく、私がJSを知らないことです。jQueryでJavaScriptの戻り値を使用する

jQueryからイメージのサイズを変更するために呼び出すことのできるJSの小さな関数を作成しようとしています。 JS関数を実行した後、値をjQueryに戻す方法がわかりません。あなたが見ることができるように、私はいくつかの値にフィードバックnew_widthとnew_height取得しようとしている

$('a').click(function() { 
    var slideshowHeight = $(this).closest('.stage').css('height') 
    var slideshowWidth = $(this).closest('.stage').css('width') 
    var newImageHeight = $(this).attr('data-height') 
    var newImageWidth = $(this).attr('data-width') 

    fit_within_box(slideshowWidth, slideshowHeight, newImageWidth, newImageHeight); 

    $(this).children('img').css('width',new_width); 
    $(this).children('img').css('width',new_height); 
} 

function fit_within_box(box_width, box_height, width, height) 
{ 
    var new_width = width 
    var new_height = height 
    var aspect_ratio = parseInt(width)/parseInt(height) 

    if (new_width > box_width) 
    { 
     new_width = box_width 
     new_height = int(new_width/aspect_ratio) 
    } 

    if (new_height > box_height) 
    { 
     new_height = box_height 
     new_width = int(new_height * aspect_ratio) 
    } 
    return (new_width, new_height) 
} 

:ここで私はこれまで持っているものです。

ありがとうございました!

答えて

0

あなたは、このようなJSONオブジェクトを返すように試みることができます。

return { 
    new_height:height, 
    new_width:width 
}; 

あなたのjquery関数でそれを使用してください:

var fit_img = fit_within_box(...); 
... 
$(this).children('img').css('height',fit_img.new_height); 
+1

これはJSONオブジェクトではなく、オブジェクトリテラルです。 – alex

1

一度に両方の値を返すようにしたい場合は、オブジェクトリテラルでそれを行うことができ...

return { 
    width: new_width, 
    height: new_height 
}; 
+0

:いくつかの壁紙と

$(function(){ $('a').click(function() { var slideshowHeight=$(this).closest('.stage').height(); var slideshowWidth=$(this).closest('.stage').width(); var newImageHeight=$(this).attr('data-height'); var newImageWidth=$(this).attr('data-width'); var size=fit_within_box(slideshowWidth,slideshowHeight,newImageWidth,newImageHeight); $(this).children('img').css({'width':size[0],'height':size[1]}); }); function fit_within_box(box_width,box_height,new_width,new_height){ var aspect_ratio=new_width/new_height; if(new_width>box_width){ new_width=box_width; new_height=Math.round(new_width/aspect_ratio); } if(new_height>box_height){ new_height=box_height; new_width=Math.round(new_height*aspect_ratio); } return [new_width,new_height]; } }); 

HTML:あなたはchildren('img');

jQueryの上の幅の2倍を使用しました。 jQueryでどのようにアクセスできますか?私はこのような推測: リサイズ= fit_within_box(A、B、X、Y) resize.width resize.height右に見える していますか? –

+0

'fit_within_box'関数の値もどこかにキャプチャする必要があります。 OPコード内の構文エラーについての注意、 'return(1、2、...、n)'は 'n'を返すだけなので、OPは' new_height'を関数として返されます。 – jball

+0

@Drew Baker、あなたの 'var'キーワードを忘れないでください。 – jball

0

ちょっと、ここに実例があります、私はいくつかの小さな間違いを修正しました。うんそれは良いアイデアだ

<div class="stage" style="width:200px;height:200px;"> 
<a href="#" data-width="1280" data-height="1024"><img src="wallpaper_1280x1024.jpg" /></a> 
</div> 

乾杯

G.

関連する問題