JS web image by scale adaptive scaling method
- 2020-03-30 01:21:53
- OfStack
Users upload photos, the size of the photos is unknown; A preview needs to be generated, which is self-applied and centered according to the area provided to the user for preview. If the image is too large, scale it. The diagram below.
< img border = 0 SRC = "/ / files.jb51.net/file_images/article/201401/2014115143443930.png" >
If I take a peek, I can use text-align:center; To implement. And scale to scale, using the preset < Img / > The properties of width and height cannot be solved. Because the user picture may be very long, may be very wide. I thought about their relationship online, and here's what it looked like:
If (actual width > Preview maximum width) {
Zoom width = preview maximum width
}