Recommended for self-use Javascript thumbnail function (onDOMLoaded)..._Image special effects

070520: Norman Jun gave Dean Edwards and other cross-browser solutions to the onDOMLoaded event...
In fact, onDOMLoaded is a "non-existent" event when the DOM is loaded (the image has not yet been loaded). ...
Due to the different support levels of different browsers...
So a Hack is needed...
Fortunately, Dean and some other friends came up with a solution after repeated research...
I would like to express my gratitude. ...
The improvement of the thumbnail function itself is to merge the two different modes of the previous version (fast and smooth)...
The so-called fast mode uses a while loop...
It is fast but It is easy to cause suspended animation...
The so-called gentle mode uses the setInterval function to solve the above problems...
Unfortunately, setInterval has a minimum period limit...
So the speed is slower...
From fast to gentle mode I set the switching threshold to 500...
That is, when the image size of a page reaches 500, the gentle mode will be enabled to reduce the image...
You can change it according to your own needs...
Please see the details The second line of the resizeImgs function...

070516: Thanks to Norman for his suggestions on improving code performance...
Change traversing all elements to traversing the image array...
As for Norman's suggestion The function of thumbnailing before the image is read...
Failed to implement...
Firstly, it is because Firefox does not support the onreadystatechange event (only onload?)...
Secondly, it is under testing I found that resizing the image in the interactive state under IE also needs to be refreshed before it can be executed...
That is to say, you have to wait until the page is loaded (or loaded once) before the operation can be performed...
Sorry for my lack of talent and knowledge...
If you have a solution, please leave a message to the professor...

How about the principle...
It is to traverse the image array...
If the resize attribute is defined, perform thumbnails...
When resize If the value is a number (and smaller than the width of the original image), it will be reduced to the digital width...
When resize is another value, it will be reduced to the default width...
As for why the height attribute needs to be cleared...
Answer Said: In order to maintain the ratio of width to height...
Above...

Due to the code being too long...
Not posted yet...
Please refer to the Demo for usage...

The above is the recommended Javascript thumbnail function (onDOMLoaded)..._image special effects. For more related content, please pay attention to the PHP Chinese website (m.sbmmt.com)!