Web students often encounter situations where customers upload images to break through the webpage content area. The following describes how to use js to solve this problem, the specific idea is to process the width or height of the Image right after js judges that the Image on the client is downloaded. js processes the Image mainly by using the Image object in javascript, the onload event and onreadystatechange are used to determine whether to perform the operation.
(1) method 1, through the onload event, for example:
<Script type = "text/javascript"> var obj = new Image (); obj. src = "http://www.phpernote.com/uploadfiles/editor/201107240502201179.jpg"; obj. onload = function () {alert ('image width: '+ obj. width + '; the image height is:' + obj. height); document. getElementById ("mypic "). innnerHTML = " <div id = "mypic"> onloading ...... </Div>
(2) Method 2: onreadystatechange
<Script type = "text/javascript"> var obj = new Image (); obj. src = "http://www.phpernote.com/uploadfiles/editor/201107240502201179.jpg"; obj. onreadystatechange = function () {if (this. readyState = "complete") {alert ('image width: '+ obj. width + '; the image height is:' + obj. height); document. getElementById ("mypic "). innnerHTML = " <div id = "mypic"> onloading ...... </Div>
Articles you may be interested in
- Js determines whether the image has been loaded
- Image zoom-in display special effects slimbox the most lightweight function the most powerful Jquery Image zoom-in special effects
- Jquery checks whether an image fails to be loaded.
- Js address bar special effects (display the size of all images with links on the page and view the height of the current browser)
- Javascript asynchronous loading improves the browsing speed of web pages
- Javascript determines whether the mouse is left or right-click-compatible with ie, firefox, chrome, and other major browsers
- How to Use jquery. lazyload to dynamically delay page image loading
- Php retrieves and outputs a list Of all images in the content