Recommend your own Javascript thumbnail function (ondomloaded) ... _ Image effects
Source: Internet
Author: User
070520:norman a cross-browser solution to the ondomloaded event, such as Dean Edwards ...
In fact, ondomloaded is a "nonexistent" event in which the DOM is loaded (the picture is not loaded) ...
Due to different browser support degrees ...
So we need to Hack ...
Luckily, Dean and a few other friends have been researching and giving the solution ...
Here to express our gratitude ...
The improvement of the thumbnail function itself is the merging of the last version of the two different modes (fast and smooth) ...
So-called fast mode is using the while loop ...
Fast but prone to suspended animation ...
The so-called gentle mode uses the SetInterval function to solve the above problem ...
Unfortunately SetInterval has the shortest cycle limit ...
So the speed is slow ...
Switching thresholds from fast to smooth mode I set to 500 ...
That is, when a picture of a page reaches 500, it enables the gentle mode to shrink the image ...
The guys can change according to their needs ...
Please see the second line of Resizeimgs function ...
070516: Thank Norman for your suggestions on improving code performance ...
The traversal of all elements is changed to traverse the image array ...
As for the Norman proposed the function of the thumbnail before the image is read ...
Failed to achieve ...
One is because Firefox does not support onreadystatechange events (only onload?) ）......
Secondly, it is found in the test under IE in the interactive state to adjust the image size needs to be refreshed after the implementation ...
That means you have to wait for the page to load (or load it once) before you can do it ...
My humble talents ...
If there is a solution message professor ...
Principle .....
is to traverse the image array ...
If you define the Resize property, do a thumbnail ...
When the resize value is a number (and is less than the original width), it shrinks to the number width ...
Reduce to preset width when resize to other values ...
As for why to clear the Height property ...
Answer Yue: In order to maintain a wide, high ratio ...
Above......
Because the code is too long ...
Do not post ...
Use the method see Demo ...
Http://www.jb51.net/test/resizeIMGs_1.2/index.html
Local Downloads
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.
A Free Trial That Lets You Build Big!
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
