Hướng dẫn javascript resize image before load - javascript thay đổi kích thước hình ảnh trước khi tải

Tôi đang sử dụng plugin này để tạo thư viện và thu phóng hình ảnh, nhưng tôi muốn mở rộng tất cả các hình ảnh để phù hợp với container [sử dụng thuật toán tỷ lệ].

Đây là chức năng tỷ lệ:

function scaleSize[maxW, maxH, currW, currH]{
  var ratio = currH / currW;
  if[currW >= maxW && ratio = maxH]{
     currH = maxH;
     currW = currH / ratio;
  }
  return [currW, currH];
}

Và đây là cách các hình ảnh tải thư viện:

 var img = $['
Image resized to 400x300px [enlarged for representation here] using real-time transformations
Bạn có thể sử dụng URL này trực tiếp trên trang web hoặc ứng dụng của mình cho hình ảnh sản phẩm và người dùng của bạn có được hình ảnh chính xác ngay lập tức.
Nếu bạn không muốn cắt hình ảnh trong khi thay đổi kích thước, có một số chế độ cắt có thể.
 var img = $['
Compared to the previous transformation, the output image here has more grey padding around all its edges. 
Chúng tôi đã xuất bản các hướng dẫn về cách bạn có thể thực hiện những điều sau đây bằng cách sử dụng thao tác hình ảnh thời gian thực của ImageKit.

  

Thay đổi kích thước hình ảnh - Thao tác chiều cao và chiều rộng cơ bản
Cây trồng và bảo tồn tỷ lệ khung hình
Phát hiện mặt và đối tượng
Thêm hình mờ
Thêm lớp phủ văn bản
Thích ứng với kết nối Internet chậm
Đang tải một trình giữ chỗ chất lượng thấp mờ
Bản tóm tắt
Trong hầu hết các trường hợp, bạn không nên thực hiện thay đổi kích thước hình ảnh trong trình duyệt vì nó chậm và dẫn đến chất lượng kém. Thay vào đó, bạn nên sử dụng hình ảnh CDN như ImageKit.io để thay đổi kích thước hình ảnh bằng cách thay đổi URL hình ảnh. Hãy thử kế hoạch miễn phí mãi mãi của chúng tôi ngày hôm nay!
Nếu trường hợp sử dụng của bạn yêu cầu thay đổi kích thước phía máy khách, có thể sử dụng phần tử 
 var img = $[''].load[function[]{
            img.appendTo[a];
            image_container.html[a];
 }].attr['src', src].addClass[opts.big_image_class];
3.