javascriptͼƬä¯ÀÀÆ÷µÄºËÐÄ——ͼƬԤ¼ÓÔØ
javascriptͼƬä¯ÀÀÆ÷µÄºËÐÄ——ͼƬԤ¼ÓÔØ
2009-04-06 10:57
ÍøÕ¾¿ª·¢Ê±¾³£ÐèÒªÔÚij¸öÒ³ÃæÐèҪʵÏÖ¶Ô´óÁ¿Í¼Æ¬µÄä¯ÀÀ£¬Èç¹û¿¼ÂÇÁ÷Á¿µÄ»°£¬´ó¿ÉÒÔÏñpconlineÒ»Ñùÿ¸öÒ³ÃæÖ»ÏÔʾһÕÅͼƬ£¬ÈÃÓû§Ã¿¿´Ò»ÕÅͼƬ¾ÍÐèÒªÖØÐÂÏÂÔØÒ»ÏÂÕû¸öÒ³Ãæ¡£²»¹ý£¬ÔÚweb2.0ʱ´ú£¬¸ü¶àÈËÔ¸ÒâÓÃjavascriptÀ´ÊµÏÖÒ»¸öͼƬä¯ÀÀÆ÷£¬ÈÃÓû§ÎÞÐèµÈ´ý¹ý³¤µÄʱ¼ä¾ÍÄÜ¿´µ½ÆäËûͼƬ¡£
ÖªµÀÁËÒ»ÕÅͼƬµÄµØÖ·£¬ÐèÒª°ÑËüÔÚÒ»¸ö¹Ì¶¨´óСµÄhtmlÈÝÆ÷£¨¿ÉÒÔÊÇdivµÈ£©Àï±ßÏÔʾ³öÀ´£¬×îÖØÒªµÄµ±È»ÊÇÐèÒªÖªµÀÕâÕż´½«ÏÔʾµÄͼƬµÄ¿íºÍ¸ß£¬È»ºóÔÙ½áºÏÈÝÆ÷µÄ¿íºÍ¸ß£¬°´ÕÕÒ»¶¨µÄËõ·Å±ÈÀýʹͼƬÏÔʾ³öÀ´¡£Òò´Ë£¬ÊµÏÖͼƬԤ¼ÓÔؾͳÉΪͼƬä¯ÀÀÆ÷µÄºËÐŦÄÜÁË¡£
×ö¹ýͼƬ·×ªÐ§¹ûµÄÅóÓÑÆäʵ¶¼ÖªµÀ£¬ÒªÈÃͼƬÂÖ»»µÄʱºò²»³öÏֵȴý£¬×îºÃÊÇÏÈÈÃͼƬÏÂÔص½±¾µØ£¬ÈÃä¯ÀÀÆ÷»º´æÆðÀ´¡£Õâʱ£¬Ò»°ã¶¼»áÓõ½jsÀï±ßµÄImage¶ÔÏó¡£Ò»°ãµÄÊÖ¶ÎÎÞ·ÇÕâÑù£º
function preLoadImg(url) {
var img = new Image();
img.src = url;
}
ͨ¹ýµ÷ÓÃpreLoadImgº¯Êý£¬´«ÈëͼƬµÄurl£¬¾ÍÄÜʹͼƬԤÏÈÏÂÔØÏÂÀ´ÁË¡£Êµ¼ÊÉÏ£¬ÕâÀïÓõ½µÄÔ¤ÏÂÔع¦ÄÜÒ²ºÍÕâ»ù±¾Ò»Ö¡£Í¼Æ¬Ô¤ÏÂÔØÏÂÀ´ºó£¬Í¨¹ý imgµÄwidthºÍheightÊôÐÔ£¬¾ÍÄÜÖªµÀͼƬµÄ¿íºÍ¸ßÁË¡£µ«ÊÇÐèÒª¿¼Âǵ½£¬ÔÚ×öͼƬä¯ÀÀÆ÷¹¦ÄÜʱ£¬Í¼Æ¬¶¼ÊÇʵʱÏÔʾµÄ¡£±ÈÈçÄãµãÁËÏÔʾµÄ°´Å¥£¬Õâ¸öʱºò²Å»áµ÷ÓÃÉϱßÀàËƵĴúÂëÀ´¼ÓÔØͼƬ¡£Òò´Ë£¬Èç¹ûÄãÖ±½ÓÓÃimg.widthµÄʱºò£¬Í¼Æ¬»¹Ã»ÓÐÍêÈ«ÏÂÔØÏÂÀ´¡£Òò´Ë£¬ÐèÒªÓÃһЩÒì²½µÄ·½·¨£¬µÈµ½Í¼Æ¬ÏÂÔØÍê±ÏµÄʱºò²Å»áÔÙ¶ÔimgµÄwidthºÍheight½øÐе÷Óá£
ʵÏÖÕâÑùµÄÒì²½·½·¨Êµ¼ÊÉϲ»ÄÑ£¬Í¼Æ¬µÄÏÂÔØÍê±ÏʼþÒ²ºÜ¼òµ¥£¬¾ÍÊǼòµ¥µÄonloadʼþ¡£Òò´Ë£¬ÎÒÃÇ¿ÉÒÔд³öÏÂÃæµÄ´úÂ룺
function loadImage(url, callback) {
var img = new Image();
img.src = url;
img.onload = function(){ //ͼƬÏÂÔØÍê±ÏʱÒì²½µ÷ÓÃcallbackº¯Êý¡£
callback.call(img); // ½«callbackº¯ÊýthisÖ¸ÕëÇл»Îªimg¡£
};
}
ºÃÁË£¬ÔÙÀ´Ð´Ò»¸ö²âÊÔÓÃÀý¡£
function imgLoaded(){
alert(this.width);
}
<input type="button" value="loadImage" onclick="loadImage('aaa.jpg',img
Ïà¹ØÎĵµ£º
1.Text µ¥Ðе¥ÁÐÊäÈëÔªËØ
¹¦ÄÜ£º¶ÔText±êʶÖеÄÔªËØʵʩÓÐЧµÄ¿ØÖÆ
»ù±¾ÊôÐÔ£º
Name£ºÉ趨Ìá½»ÐÅÏ ......
var docEle = function() {
return document.getElementById(arguments[0]) || false;
}
function cloDiv(){
var overlayID="overlay";
var msgID = "overlayMsg";
document.body.removeChild(docEle(overlayID));
document.body.removeChild(docEle(msgID));
}
function openNewDiv() {
......
ÓÃJavaScriptÒþ²Ø¿Ø¼þµÄ·½·¨ÓÐÁ½ÖÖ£¬·Ö±ðÊÇͨ¹ýÉèÖÿؼþµÄstyleµÄ“display”ºÍ“visibility”ÊôÐÔ¡£µ±style.display="block"»òstyle.visibility="visible"ʱ¿Ø¼þ»ò¼û£¬µ±style.display = "none"»òstyle.visibility = "hidden"ʱ¿Ø¼þ²»¿É¼û¡£²»Í¬µÄÊÇ“display”²»µ«Òþ²Ø¿Ø¼þ£¬¶øÇÒ±»Òþ²ØµÄ¿ ......
1ÅжÏselectÑ¡ÏîÖÐ ÊÇ·ñ´æÔÚValue="paraValue"µÄItem
2ÏòselectÑ¡ÏîÖÐ ¼ÓÈëÒ»¸öItem
3´ÓselectÑ¡ÏîÖРɾ³ýÒ»¸öItem
4ɾ³ýselectÖÐÑ¡ÖеÄÏî
5ÐÞ¸ÄselectÑ¡ÏîÖÐ value="paraValue"µÄtextΪ"paraText"
6ÉèÖÃselectÖÐtext="paraText"µÄµ ......
1>zInherit£º
ËüÊÇÒ»¸ö×é¼þ£¬ÓÃÀ´¼Ì³Ð»ùÀàµÄËùÓÐÊôÐԺͷ½·¨¡£¸úÒÔǰ˵µ½µÄÔÐÍÁ´Ä£Ê½·Ç³£ÀàËÆ£¬Ö»²»¹ý±ÈÔÐ͸ü°²È«£¬Ò²ÎÞÐ뿼ÂDzÎÊýÎÊÌâ¡£ÏÂÃæ¿´¿´zInheritµÄÓ÷¨£º
¸Ã×é¼þÖÐÖ»ÓÐÁ½¸ö·½·¨£ºinheritfrom() instanceof()
func ......