Jqueryダイナミックに画像のサムネイルを行う

3485 ワード

//       resizeImage()  
$(document).ready(resizeImage());

function resizeImage(){
    $(".pic a img").each(function(){
                //
        $(this).load(function(){
                        //        
            var imgWidth = $(this).width();
            var imgHeight = $(this).height();
                        //      Div  
            var boxWidth=$('.pic').width();
            var boxHeight=$('.pic').height();
            //  imgBox     img      
            if((boxWidth/boxHeight)>=(imgWidth/imgHeight))
            {
                    //    img width height
                $(this).width((boxHeight*imgWidth)/imgHeight);
                   $(this).height(boxHeight);
                   //       
                   var margin=(boxWidth-$(this).width())/2;
                   $(this).css("margin-left",margin);
            }
            else
            {
                   //    img width height
                   $(this).width(boxWidth);
                   $(this).height((boxWidth*imgHeight)/imgWidth);
                  //       
                   var margin=(boxHeight-$(this).height())/2;
                   $(this).css("margin-top",margin);
            }
        });            
    })
}