网页图片处理代码全集整理
生活随笔
收集整理的這篇文章主要介紹了
网页图片处理代码全集整理
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1,掉鏈級圖片的替代圖片
? ? ? ? <img src="no.jpg" οnerrοr="this.src='images/logo.gif'">
? ? ? ? 2,自動縮小大圖
? ? ? ? 經??吹揭恍﹫D片很大,上傳后顯示會撐滿屏幕下面的例子通過檢測if(this.width>screen.width-350)then(this.width=screen.width-350)如果該圖片的寬度大于“屏幕寬度-350”,則讓該圖就顯示“屏幕寬度-350”這么大小。
? ? ? ? 原圖<br>
? ? ? ? <img src="jsimg/wallpaper.jpg"><br>
? ? ? ? 設定大小的圖<br>
? ? ? ? <img src="jsimg/wallpaper.jpg"
? ? ? ? οnlοad="javascript:if(this.width>screen.width-350)this.width=screen.width-350">
? ? ? ? 3,禁止IE6中大尺寸圖片的自動縮小
? ? ? ? 原圖,會自動縮小<br>
? ? ? ? <img src="jsimg/wallpaper.jpg"> <br>
? ? ? ? 設定不縮小<br>
? ? ? ? <img src="jsimg/wallpaper.jpg" galleryimg="no">
? ? ? ? 4,去掉用IE6.0瀏覽圖片,當鼠標放到圖片上時出現快捷工具(打印、郵寄、另存等)
? ? ? ? 方法一:
? ? ? ? <META HTTP-EQUIV="imagetoolbar" CONTENT="no">
? ? ? ? 方法二:
? ? ? ? <img galleryimg="no">
? ? ? ? 定義CSS:
? ? ? ? <style>
? ? ? ? img {nobar:expression(this.galleryImg='no')}
? ? ? ? </style>
? ? ? ? 5,去掉熱點地圖上的區域線框與超鏈接的線框
? ? ? ? <a href="#" onFocus=this.blur()><img src="jsimg/marylin.jpg"
? ? ? ? border=0></a>
? ? ? ? 6,可控制上傳圖片的大小
? ? ? ? <script language="JavaScript">
? ? ? ? function orsc()
? ? ? ? {
? ? ? ? if(img.readyState!="complete")return false;
? ? ? ? if(img.offsetWidth!=132&&img.offsetHeight!=99){
? ? ? ? alert("您選擇的圖片大小:"+img.offsetWidth+"X"+img.offsetHeight+"\n"+"請選擇132X99大小的圖片")
? ? ? ? imgT=true;
? ? ? ? }
? ? ? ? //alert("圖片大小:"+img.offsetWidth+"X"+img.offsetHeight);
? ? ? ? //alert("圖片尺寸:"+img.fileSize);
? ? ? ? }
? ? ? ? function mysubmit(theform)
? ? ? ? {
? ? ? ? if(theform.file1.value=="")
? ? ? ? {
? ? ? ? alert("請點擊瀏覽按鈕,選擇您要上傳的JPG或GIF文件!")
? ? ? ? theform.file1.focus;
? ? ? ? return (false);
? ? ? ? }
? ? ? ? else
? ? ? ? {
? ? ? ? str= theform.file1.value;
? ? ? ? strs=str.toLowerCase();
? ? ? ? lens=strs.length;
? ? ? ? extname=strs.substring(lens-4,lens);
? ? ? ? if(extname!=".jpg" && extname!=".gif")
? ? ? ? {
? ? ? ? ? alert("請選擇JPG或GIF格式的文件!");
? ? ? ? ? return (false);
? ? ? ? }else{
? ? ? ? document.all("loadImg").src=theform.file1.value
? ? ? ?
? ? ? ? if(document.all("loadImg").offsetWidth!=132&&document.all("loadImg").offsetHeight!=99){
? ? ? ? alert("您選擇的圖片大小:"+document.all("loadImg").offsetWidth+"X"+document.all("loadImg").offsetHeight+"\n"+"請選擇132X99大小的圖片")
? ? ? ? return (false)
? ? ? ? }
? ? ? ? }
? ? ? ?
? ? ? ? }
? ? ? ?
? ? ? ? }
? ? ? ? </script>
? ? ? ? <form onSubmit="return mysubmit(this)" name="form" method="post"
? ? ? ? enctype="multipart/form-data">
? ? ? ? <table width="100%" border=0 cellspacing=0 cellpadding=0>
? ? ? ? <tr><td valign=top height=30>
? ? ? ? <input type="hidden" name="act" value="upload">
? ? ? ? ? ? <input type="file" style="BORDER-TOP-WIDTH: 1px;
? ? ? ? BORDER-LEFT-WIDTH: 1px; FONT-SIZE: 12px; BORDER-BOTTOM-WIDTH: 1px;
? ? ? ? CURSOR: text; COLOR: #333333; FONT-FAMILY: "MS Shell Dlg",
? ? ? ? ","Tahoma", ","宋體"; HEIGHT: 20px; BORDER-RIGHT-WIDTH: 1px
? ? ? ? " name="file1" value="">
? ? ? ? ? ? <input type="submit" name="Submit" value="上傳" >
? ? ? ? ? ? </td>
? ? ? ? ? </tr>
? ? ? ? </table>
? ? ? ? <img id=loadImg>
? ? ? ? </form>
? ? ? ? 7,檢測一個圖片的長寬尺寸
? ? ? ? <script>
? ? ? ? var img=null;
? ? ? ? function s()
? ? ? ? {
? ? ? ? if(img)img.removeNode(true);
? ? ? ? img=document.createElement("img");
? ? ? ? img.style.position="absolute";
? ? ? ? img.style.visibility="hidden";
? ? ? ? img.attachEvent("onreadystatechange",orsc);
? ? ? ? img.attachEvent("onerror",oe);
? ? ? ? document.body.insertAdjacentElement("beforeend",img);
? ? ? ? img.src=inp.value;
? ? ? ? }
? ? ? ? function oe()
? ? ? ? {
? ? ? ? alert("cant load img");
? ? ? ? }
? ? ? ? function orsc()
? ? ? ? {
? ? ? ? if(img.readyState!="complete")return false;
? ? ? ? alert("高:"+img.offsetHeight+"\n寬:"+img.offsetWidth);
? ? ? ? }
? ? ? ? </script>
? ? ? ? <input type="file" Name="file" id="inp" value="默認值"><br><input
? ? ? ? οnclick="s()" type="button" value="點我一下給出要上傳圖片的大小及長、寬"
name="button">
? ? ? ? 8,按比例縮小
? ? ? ? <script defer>
? ? ? ? for (var i=0;i<document.images.length;i++){
? ? ? ? document.images.width=document.images.width*0.5
? ? ? ? }
? ? ? ? </script>
? ? ? ? <img src="img/wallpaper.jpg">
? ? ? ? 9,類似Acdsee看大圖的時的拖動
? ? ? ? <html>
? ? ? ? <head>
? ? ? ? <title>Untitled ? Document</title>
? ? ? ? <meta ? http-equiv="Content-Type" ? content="text/html; ?
? ? ? ? charset=gb2312">
? ? ? ? <script ? language="JavaScript">
? ? ? ? <!--
? ? ? ? var ? scrollcount=0;
? ? ? ? var ? dragy;
? ? ? ? var ? scrollarrowtop;
? ? ? ? function ? initdrag() ? {
? ? ? ? scrollcount=1;
? ? ? ? dragy=event.clientY;
? ? ? ? document.body.setCapture();
? ? ? ? }
? ? ? ? function ? startdrag() ? {
? ? ? ? if ? (scrollcount==1) ? {
? ? ? ? window.scrollBy(dragy-event.clientX,dragy-event.clientY);
? ? ? ? document.body.style.cursor='hand';
? ? ? ? dragy=event.clientY;
? ? ? ? }
? ? ? ? }
? ? ? ? function ? enddrag() ? {
? ? ? ? document.body.style.cursor='';
? ? ? ? scrollcount=0;
? ? ? ? document.body.releaseCapture();
? ? ? ? }
? ? ? ? // ? -->
? ? ? ? </script>
? ? ? ? </head>
? ? ? ? <body ? bgcolor="#FFFFFF" ? text="#000000" ?
? ? ? ? onselectstart="return ? false;" ? οnmοusedοwn="initdrag()" ?
? ? ? ? οnmοusemοve="startdrag()" ? οnmοuseup="enddrag()" ? scroll=yes>
? ? ? ? <img ? ? src="img/wallpaper.jpg"> ?
? ? ? ? <img ? ? src="img/whitney.jpg">
? ? ? ? </body>
? ? ? ? </html>
? ? ? ? 10,選擇圖片產生縮略圖,最多10個
? ? ? ? <html>
? ? ? ? <head>
? ? ? ? <title>Upload Image</title>
? ? ? ? <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
? ? ? ? <SCRIPT language=Javascript>
? ? ? ? gFlag=false;
? ? ? ? var
? ? ? ? gMaxSize,gCurrentSize,gUploadSize,gCurInputIndex,gCurImageSrc,gCurOFile;
? ? ? ? gMaxSize="10";
? ? ? ? gCurrentSize=".18";
? ? ? ? gMaxSize=parseFloat(gMaxSize)*1024*1024;
? ? ? ? //gMaxSize=parseFloat("1")*1024;
? ? ? ? gCurrentSize=parseFloat(gCurrentSize)*1024*1024;
? ? ? ? gErr="";
? ? ? ? gUploadSize=0;
? ? ? ?
? ? ? ? ? ? function validate()
? ? ? ? ? ? {
? ? ? ? ? ? var lErr;
? ? ? ? ? ? lErr="";
? ? ? ? ? ? ? if((gUploadSize+gCurrentSize)>gMaxSize){
? ? ? ? ? ? ? ? if(form1.TempAlbum.value!=form1.OldAlbum.value){
? ? ? ? ? ? ? ? ? lErr=".您要上傳的圖片尺寸大于您的剩余相冊容量,請選擇上傳至\"臨時相冊\"\n"+lErr;
? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? ? ? if(form1.OldAlbum.value=="0"){
? ? ? ? ? ? ? ? if(form1.NewAlbum.value.length==0){
? ? ? ? ? ? ? ? ? lErr=".請輸入新相冊名稱\n"+lErr;
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? }
? ? ? ? ? ? ? if(lErr.length>0){
? ? ? ? ? ? ? ? alert("錯誤:\n"+lErr);
? ? ? ? ? ? ? ? if(lErr.indexOf("請輸入新相冊名稱\n\n")!=-1){
? ? ? ? ? ? ? ? ? ? form1.NewAlbum.focus();
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? return false;
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ? form1.submit();
? ? ? ? ? ? ? ? /*進度條控制*/
? ? ? ? ? ? ? ? //var
? ? ? ? winProgress=window.open("progress.htm","progress","width=300,height=250");
? ? ? ? ? ? ? ? //winProgress.focus();
? ? ? ? ? ? ? ? /*進度條控制*/
? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ? return true;
? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? function handleBadImage() {
? ? ? ? ? ? alert('所選圖片并非有效的JPG格式!\n請重新選擇!');
? ? ? ? ? ? eval("form1.file"+gCurInputIndex+".outerHTML=\"<input
? ? ? ? type=\\\"file\\\" name=\\\"file"+gCurInputIndex+"\\\"
? ? ? ? style=\\\"width:275\\\" value=\\\"\\\"
? ? ? ? onChange=\\\"FileChange(this);\\\">\"");
? ? ? ? ? ?
eval("form1.file"+gCurInputIndex+".fireEvent(\"onChange\")");
? ? ? ? ? ? return false;
? ? ? ? ? }
? ? ? ? ?
? ? ? ? ? function handleGoodImage() {
? ? ? ? ? ? imgsrc='<img src="'+gCurImageSrc+'"
? ? ? ? οnlοad="DrawImage(this,'+gCurInputIndex+'); " width="0"
height="0">';
? ? ? ? ? ? gCurOFile.parentNode.previousSibling.innerHTML=imgsrc;
? ? ? ? ? ? return true;
? ? ? ? ? }
? ? ? ? ? //
? ? ? ? ? ? function FileChange(oFile){
? ? ? ? ? ? gErr="";
? ? ? ? ? ? gUploadSize=0;
? ? ? ? ? ? str='';
? ? ? ? ? ? gCurOFile=oFile;
? ? ? ? ? ? gCurImageSrc=oFile.value;
? ? ? ? ? ? inputname=oFile.name;
? ? ? ? ? ? i=inputname.substr((inputname.length-1),1);
? ? ? ? ? ? gCurInputIndex=i;
? ? ? ? ? ?
? ? ? ? ? ? if (gCurImageSrc.length>0){
? ? ? ? ? ? ? ? //check for none jpg
? ? ? ? ? ? ? ? imgExt=new Image();
? ? ? ? ? ? ? ? imgExt.οnlοad=handleGoodImage;
? ? ? ? ? ? ? ? imgExt.οnerrοr=handleBadImage;
? ? ? ? ? ? ? ? var fileName = gCurImageSrc.replace("\\", "/"); // NN7
? ? ? ? ? ? ? ? var imgURL = 'file:///' + fileName;
? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ? if((navigator.appVersion.indexOf('Mac')>-1) &&
? ? ? ? (navigator.appVersion.indexOf('MSIE')>-1)){
? ? ? ? ? ? ? ? ? imgURL='file://' + fileName;
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? imgExt.src=imgURL;
? ? ? ? ? ? ? ? //finish check
? ? ? ? ? ? ?
? ? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? ? function ShowImgOfServer(NewPath,ImgD){
? ? ? ? ? ? ImgD.src=NewPath;
? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? /
? ? ? ? ? function DrawImage(ImgD,Index){
? ? ? ? ? var flag=false;
? ? ? ? ? ? var image=new Image();
? ? ? ? ? ? image.src=ImgD.src;
? ? ? ? ? ? ImgD.value=ImgD.src;
? ? ? ? ? ? if(image.fileSize>2048000){
? ? ? ? ? ? ? image.outerHTML="";
? ? ? ? ? ? ? gErr+="此圖片尺寸過大,圖片尺寸應小于2MB\n";
? ? ? ? ? ? ? eval("form1.file"+Index+".outerHTML=\"<input
? ? ? ? type=\\\"file\\\" name=\\\"file"+Index+"\\\" style=\\\"width:275\\\"
? ? ? ? value=\\\"\\\" onChange=\\\"FileChange(this);\\\">\"");
? ? ? ? ? ? ? eval("form1.file"+Index+".fireEvent(\"onChange\")");
? ? ? ? ? ? ? alert("此圖片尺寸過大,圖片尺寸應小于2MB\n");
? ? ? ? ? ? ? return ;
? ? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? if(image.src.substr(image.src.length-3,3).toLowerCase()!="jpg"){
? ? ? ? ? ? ? image.outerHTML="";
? ? ? ? ? ? ? gErr+="此圖片類型不匹配,只能上傳JPG(JPEG)格式文件\n";
? ? ? ? ? ? ? eval("form1.file"+Index+".outerHTML=\"<input
? ? ? ? type=\\\"file\\\" name=\\\"file"+Index+"\\\" style=\\\"width:275\\\"
? ? ? ? value=\\\"\\\" onChange=\\\"FileChange(this);\\\">\"");
? ? ? ? ? ? ? eval("form1.file"+Index+".fireEvent(\"onChange\")");
? ? ? ? ? ? ? alert("此圖片類型不匹配,只能上傳JPG(JPEG)格式文件\n");
? ? ? ? ? ? ? return ;
? ? ? ? ? ? ? }
? ? ? ? ? ? ? tempFileName=image.src;
? ? ? ? ? ? ? var iLastDot;
? ? ? ? ? ? ? iLastLine=tempFileName.lastIndexOf('/');
? ? ? ? ? ? ? if(iLastLine!=-1){
? ? ? ? ? ? ? ?
? ? ? ? tempFileName=tempFileName.substring(iLastLine+1,tempFileName.length);
? ? ? ? ? ? ? }
? ? ? ? ? ? if(!CheckIfEnglish(tempFileName)){
? ? ? ? ? ? ? image.outerHTML="";
? ? ? ? ? ? ? gErr+="此圖片文件名包含中文或其他不合法字符\n文件名只能由'a-z'、'A-Z'、'_'、'-'構成\n";
? ? ? ? ? ? ? eval("form1.file"+Index+".outerHTML=\"<input
? ? ? ? type=\\\"file\\\" name=\\\"file"+Index+"\\\" style=\\\"width:275\\\"
? ? ? ? value=\\\"\\\" onChange=\\\"FileChange(this);\\\">\"");
? ? ? ? ? ? ? eval("form1.file"+Index+".fireEvent(\"onChange\")");
? ? ? ? ? ? ?
alert("此圖片文件名包含中文或其他不合法字符\n文件名只能由'a-z'、'A-Z'、'_'、'-'構成\n");
? ? ? ? ? ? ? return ;
? ? ? ? ? ? }
? ? ? ? ? ? if(gErr.length>0){
? ? ? ? ? ? ? return;
? ? ? ? ? ? ? }
? ? ? ? ? ? if(image.width>0 && image.height>0){
? ? ? ? ? ? flag=true;
? ? ? ? ? ? if(image.width/image.height>= 120/80){
? ? ? ? ? ? ? if(image.width>120){
? ? ? ? ? ? ? ImgD.width=120;
? ? ? ? ? ? ? ImgD.height=(image.height*120)/image.width;
? ? ? ? ? ? ? }else{
? ? ? ? ? ? ? ImgD.width=image.width;
? ? ? ? ? ? ? ImgD.height=image.height;
? ? ? ? ? ? ? }
? ? ? ? ? ? ? ImgD.alt="圖片大小(寬*高):
? ? ? ? "+image.width+"×"+image.height+"\n圖片大小: "+image.fileSize+"\n圖片路徑:
? ? ? ? "+image.src;
? ? ? ? ? ? ? eval('document.all.width'+Index+'.value='+image.width);
? ? ? ? ? ? ? eval('document.all.height'+Index+'.value='+image.height);
? ? ? ? ? ? ? var oCreated=new Date(image.fileModifiedDate);
? ? ? ? ? ? ?
? ? ? ? eval('document.all.PicUpdateDate'+Index+'.value="'+oCreated.toLocaleString()+'"');
? ? ? ? ? ? ? }
? ? ? ? ? ? else{
? ? ? ? ? ? ? if(image.height>80){
? ? ? ? ? ? ? ImgD.height=80;
? ? ? ? ? ? ? ImgD.width=(image.width*80)/image.height; ?
? ? ? ? ? ? ? }else{
? ? ? ? ? ? ? ImgD.width=image.width;
? ? ? ? ? ? ? ImgD.height=image.height;
? ? ? ? ? ? ? }
? ? ? ? ? ? ? ImgD.alt="圖片大小(寬*高):
? ? ? ? "+image.width+"×"+image.height+"\n圖片大小: "+image.fileSize+"\n圖片路徑:
? ? ? ? "+image.src;
? ? ? ? ? ? ? eval('document.all.width'+Index+'.value='+image.width);
? ? ? ? ? ? ? eval('document.all.height'+Index+'.value='+image.height);
? ? ? ? ? ? ? var oCreated=new Date(image.fileModifiedDate);
? ? ? ? ? ? ?
? ? ? ? ? ? ?
? ? ? ? eval('document.all.PicUpdateDate'+Index+'.value="'+oCreated.toLocaleString()+'"');
? ? ? ? ? ? ? }
? ? ? ? ? ? ?
? ? ? ? ? ? }
? ? ? ? ? ? ? ? ?
? ? ? ? ? ? ? if(parseInt(Index)==parseInt(form1.upcount.value)){
? ? ? ? ? ? ? ? ? form1.upcount.value=parseInt(form1.upcount.value)+1;
? ? ? ? ? ? ? ? ? str+='<table width="100%" ><tr valign="middle" ><td
? ? ? ? align="center" id="tdimg" height="" width="120" ></td><td
? ? ? ? id="tdfile" >文件'+(parseInt(Index)+1)+':<input
? ? ? ? onpropertychange="FileChange(this);" type="file"
? ? ? ? name="file'+(parseInt(Index)+1)+'" style="width:275" ><input
? ? ? ? id="width'+(parseInt(Index)+1)+'"
? ? ? ? name="width'+(parseInt(Index)+1)+'" type="hidden" value=""><input
? ? ? ? id="height'+(parseInt(Index)+1)+'"
? ? ? ? name="height'+(parseInt(Index)+1)+'" type="hidden" value=""><input
? ? ? ? name="PicUpdateDate'+(parseInt(Index)+1)+'" type="hidden"
? ? ? ? id="PicUpdateDate'+(parseInt(Index)+1)+'"></td></tr></table>';
? ? ? ? ? ? ? ? ?
? ? ? ? window.upid.insertAdjacentHTML("beforeEnd",str+'<br>');
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? gUploadSize+=parseFloat(image.fileSize);
? ? ? ? ? ? ? }
? ? ? ? ? //
? ? ? ? ? ? function AlbumChange(Value){
? ? ? ? ? ? if(Value=='0'){
? ? ? ? ? ? document.all.sNewAlbum.style.display='inline';
? ? ? ? ? ? document.all.NewAlbum.focus();
? ? ? ? ? ? }
? ? ? ? ? ? else{
? ? ? ? ? ? document.all.sNewAlbum.style.display='none';
? ? ? ? ? ? }
? ? ? ? ? ? return ;
? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? ?
? ? ? ? function CheckIfEnglish( String )
? ? ? ? {
? ? ? ? ? var Letters =
? ? ? ? "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890-_.";
? ? ? ? ? var i;
? ? ? ? ? var c;
? ? ? ? ? ? if(String.charAt( 0 )=='-')
? ? ? ? ? return false;
? ? ? ? ? ? if( String.charAt( String.length - 1 ) == '-' )
? ? ? ? ? ? ? return false;
? ? ? ? ? for( i = 0; i < String.length; i ++ )
? ? ? ? ? {
? ? ? ? ? ? ? c = String.charAt( i );
? ? ? ? ? ? if (Letters.indexOf( c ) < 0)
? ? ? ? ? ? ? return false;
? ? ? ? ? }
? ? ? ? ? return true;
? ? ? ? }
? ? ? ? </SCRIPT>
? ? ? ? </head>
? ? ? ? <body >
? ? ? ? <form name="form1" method="post" action="">
? ? ? ? <TABLE align=center bgColor=#cccccc border=0
? ? ? ? ? ? ? ? ? ? ? ? ? ? borderColorDark=#cccccc
? ? ? ? borderColorLight=#000000
? ? ? ? ? ? ? ? ? ? ? ? ? ? cellPadding=5 cellSpacing=1
? ? ? ? height=367
? ? ? ? ? ? ? ? ? ? ? ? ? ? width="500">
? ? ? ? ? <TBODY>
? ? ? ? ? ? <TR vAlign=center>
? ? ? ? ? ? <TD align=left bgColor=#ffffff colSpan=2
? ? ? ? ? ? ? ? ? ? ? ? ? ? height=269 id=upid vAlign=top>
? ? ? ? <TABLE cellPadding=3 cellSpacing=1 width="100%">
? ? ? ? ? ? ? ? <TBODY>
? ? ? ? ? ? ? ? <TR vAlign=center>
? ? ? ? ? ? ? ? ? <TD align=middle bgColor=#ffffff id=tdimg
? ? ? ? ? ? ? ? ? ? ? ? ? ? width=120></TD>
? ? ? ? ? ? ? ? ? <TD bgColor=#ffffff id=tdfile>文件1:
? ? ? ? ? ? ? ? ? ? <INPUT
? ? ? ? ? ? ? ? ? ? ? ? ? ? name=file1
? ? ? ? onpropertychange=FileChange(this);
? ? ? ? ? ? ? ? ? ? ? ? ? ? style="WIDTH: 275px" type=file>
? ? ? ? <INPUT id=width1
? ? ? ? ? ? ? ? ? ? ? ? ? ? name=width1 type=hidden> <INPUT
? ? ? ? id=height1
? ? ? ? ? ? ? ? ? ? ? ? ? ? name=height1 type=hidden> <INPUT
? ? ? ? ? ? ? ? ? ? ? ? ? ? id=PicUpdateDate1
? ? ? ? name=PicUpdateDate1
? ? ? ? ? ? ? ? ? ? ? ? ? ? type=hidden></TD>
? ? ? ? ? ? ? ? </TR>
? ? ? ? ? ? ? ? </TBODY>
? ? ? ? ? ? ? </TABLE></TD>
? ? ? ? ? ? </TR>
? ? ? ? ? ? <TR bgColor=#eeeeee vAlign=center>
? ? ? ? ? ? <TD align=middle bgColor=#ebebeb colSpan=2
? ? ? ? ? ? ? ? ? ? ? ? ? ? height=24> <DIV
? ? ? ? align=left>將圖片上傳至已有相冊
? ? ? ? ? ? ? ? <SELECT id=OldAlbum
? ? ? ? ? ? ? ? ? ? ? ? ? ? name=OldAlbum
? ? ? ? οnchange=AlbumChange(this.value);>
? ? ? ? ? ? ? ? <OPTION value=0><新建相冊></OPTION>
? ? ? ? ? ? ? ? <OPTION
? ? ? ? ? ? ? ? ? ? ? ? ? ? selected value=365>臨時相冊</OPTION>
? ? ? ? ? ? ? ? </SELECT>
? ? ? ? ? ? ? ? <INPUT
? ? ? ? ? ? ? ? ? ? ? ? ? ? id=TempAlbum name=TempAlbum
? ? ? ? type=hidden
? ? ? ? ? ? ? ? ? ? ? ? ? ? value=365>
? ? ? ? ? ? ? ? <SPAN id=sNewAlbum
? ? ? ? ? ? ? ? ? ? ? ? ? ? style="DISPLAY: none">或新建相冊
? ? ? ? ? ? ? ? <INPUT id=NewAlbum
? ? ? ? ? ? ? ? ? ? ? ? ? ? maxLength=50 name=NewAlbum
? ? ? ? οnfοcus="">
? ? ? ? ? ? ? ? </SPAN></DIV></TD>
? ? ? ? ? ? </TR>
? ? ? ? ? ? <TR bgColor=#eeeeee vAlign=center>
? ? ? ? ? ? <TD align=middle bgColor=#ebebeb colSpan=2
? ? ? ? ? ? ? ? ? ? ? ? ? ? height=24> <DIV align=center><FONT
? ? ? ? size=2>
? ? ? ? ? ? ? ? <INPUT class=bt name=Submit οnclick=validate();
? ? ? ? type=button value="· 上傳已選圖片 ·">
? ? ? ? ? ? ? ? <INPUT id=upcount name=upcount type=hidden
? ? ? ? ? ? ? ? ? ? ? ? ? ? value=1>
? ? ? ? ? ? ? ? <INPUT id=from name=from type=hidden>
? ? ? ? ? ? ? ? </FONT></DIV></TD>
? ? ? ? ? ? </TR>
? ? ? ? ? </TBODY>
? ? ? ? </TABLE>
? ? ? ? </form>
? ? ? ? </body>
? ? ? ? </html>
? ? ? ? 11,不同的ALT
? ? ? ? <SCRIPT language=JavaScript1.2>
? ? ? ? <!--
? ? ? ? tPopWait=50;
? ? ? ? tPopShow=50000;
? ? ? ? showPopStep=10;
? ? ? ? popOpacity=100;
? ? ? ? sPop=null;
? ? ? ? curShow=null;
? ? ? ? tFadeOut=null;
? ? ? ? tFadeIn=null;
? ? ? ? tFadeWaiting=null;
? ? ? ? document.write("<style type='text/css'id='defaultPopStyle'>");
? ? ? ? document.write(".cPopText { background-color: #FFFFFF; border: 1px
? ? ? ? #000000 solid; font-size: 12px; padding-right: 4px; padding-left:
? ? ? ? 4px; height: 20px; padding-top: 2px; padding-bottom: 2px; filter:
? ? ? ? Alpha(Opacity=0)}");
? ? ? ? document.write("</style>");
? ? ? ? document.write("<div id='dypopLayer'
? ? ? ? style='position:absolute;z-index:1000;' class='cPopText'></div>");
? ? ? ? function showPopupText(){
? ? ? ? var o=event.srcElement;
? ? ? ? MouseX=event.x;
? ? ? ? MouseY=event.y;
? ? ? ? if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""};
? ? ? ? if(o.dypop!=sPop) {
? ? ? ? sPop=o.dypop;
? ? ? ? clearTimeout(curShow);
? ? ? ? clearTimeout(tFadeOut);
? ? ? ? clearTimeout(tFadeIn);
? ? ? ? clearTimeout(tFadeWaiting);
? ? ? ? if(sPop==null || sPop=="") {
? ? ? ? dypopLayer.innerHTML="";
? ? ? ? dypopLayer.style.filter="Alpha()";
? ? ? ? dypopLayer.filters.Alpha.opacity=0;
? ? ? ? }
? ? ? ? else {
? ? ? ? if(o.dyclass!=null) popStyle=o.dyclass
? ? ? ? else popStyle="cPopText";
? ? ? ? curShow=setTimeout("showIt()",tPopWait);
? ? ? ? }
? ? ? ? }
? ? ? ? }
? ? ? ? function showIt(){
? ? ? ? dypopLayer.className=popStyle;
? ? ? ? dypopLayer.innerHTML=sPop;
? ? ? ? popWidth=dypopLayer.clientWidth;
? ? ? ? popHeight=dypopLayer.clientHeight;
? ? ? ? if(MouseX+12+popWidth>document.body.clientWidth)
? ? ? ? popLeftAdjust=-popWidth-24
? ? ? ? else popLeftAdjust=0;
? ? ? ? if(MouseY+12+popHeight>document.body.clientHeight)
? ? ? ? popTopAdjust=-popHeight-24
? ? ? ? else popTopAdjust=0;
? ? ? ? dypopLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust;
? ? ? ? dypopLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust;
? ? ? ? dypopLayer.style.filter="Alpha(Opacity=0)";
? ? ? ? fadeOut();
? ? ? ? }
? ? ? ? function fadeOut(){
? ? ? ? if(dypopLayer.filters.Alpha.opacity<popOpacity) {
? ? ? ? dypopLayer.filters.Alpha.opacity+=showPopStep;
? ? ? ? tFadeOut=setTimeout("fadeOut()",1);
? ? ? ? }
? ? ? ? else {
? ? ? ? dypopLayer.filters.Alpha.opacity=popOpacity;
? ? ? ? tFadeWaiting=setTimeout("fadeIn()",tPopShow);
? ? ? ? }
? ? ? ? }
? ? ? ? function fadeIn(){
? ? ? ? if(dypopLayer.filters.Alpha.opacity>0) {
? ? ? ? dypopLayer.filters.Alpha.opacity-=1;
? ? ? ? tFadeIn=setTimeout("fadeIn()",1);
? ? ? ? }
? ? ? ? }
? ? ? ? document.οnmοuseοver=showPopupText;
? ? ? ? //-->
? ? ? ? </script>
? ? ? ? <img src="images/logo.gif" alt="網頁教學網">
? ? ? ? <img src="no.jpg" οnerrοr="this.src='images/logo.gif'">
? ? ? ? 2,自動縮小大圖
? ? ? ? 經??吹揭恍﹫D片很大,上傳后顯示會撐滿屏幕下面的例子通過檢測if(this.width>screen.width-350)then(this.width=screen.width-350)如果該圖片的寬度大于“屏幕寬度-350”,則讓該圖就顯示“屏幕寬度-350”這么大小。
? ? ? ? 原圖<br>
? ? ? ? <img src="jsimg/wallpaper.jpg"><br>
? ? ? ? 設定大小的圖<br>
? ? ? ? <img src="jsimg/wallpaper.jpg"
? ? ? ? οnlοad="javascript:if(this.width>screen.width-350)this.width=screen.width-350">
? ? ? ? 3,禁止IE6中大尺寸圖片的自動縮小
? ? ? ? 原圖,會自動縮小<br>
? ? ? ? <img src="jsimg/wallpaper.jpg"> <br>
? ? ? ? 設定不縮小<br>
? ? ? ? <img src="jsimg/wallpaper.jpg" galleryimg="no">
? ? ? ? 4,去掉用IE6.0瀏覽圖片,當鼠標放到圖片上時出現快捷工具(打印、郵寄、另存等)
? ? ? ? 方法一:
? ? ? ? <META HTTP-EQUIV="imagetoolbar" CONTENT="no">
? ? ? ? 方法二:
? ? ? ? <img galleryimg="no">
? ? ? ? 定義CSS:
? ? ? ? <style>
? ? ? ? img {nobar:expression(this.galleryImg='no')}
? ? ? ? </style>
? ? ? ? 5,去掉熱點地圖上的區域線框與超鏈接的線框
? ? ? ? <a href="#" onFocus=this.blur()><img src="jsimg/marylin.jpg"
? ? ? ? border=0></a>
? ? ? ? 6,可控制上傳圖片的大小
? ? ? ? <script language="JavaScript">
? ? ? ? function orsc()
? ? ? ? {
? ? ? ? if(img.readyState!="complete")return false;
? ? ? ? if(img.offsetWidth!=132&&img.offsetHeight!=99){
? ? ? ? alert("您選擇的圖片大小:"+img.offsetWidth+"X"+img.offsetHeight+"\n"+"請選擇132X99大小的圖片")
? ? ? ? imgT=true;
? ? ? ? }
? ? ? ? //alert("圖片大小:"+img.offsetWidth+"X"+img.offsetHeight);
? ? ? ? //alert("圖片尺寸:"+img.fileSize);
? ? ? ? }
? ? ? ? function mysubmit(theform)
? ? ? ? {
? ? ? ? if(theform.file1.value=="")
? ? ? ? {
? ? ? ? alert("請點擊瀏覽按鈕,選擇您要上傳的JPG或GIF文件!")
? ? ? ? theform.file1.focus;
? ? ? ? return (false);
? ? ? ? }
? ? ? ? else
? ? ? ? {
? ? ? ? str= theform.file1.value;
? ? ? ? strs=str.toLowerCase();
? ? ? ? lens=strs.length;
? ? ? ? extname=strs.substring(lens-4,lens);
? ? ? ? if(extname!=".jpg" && extname!=".gif")
? ? ? ? {
? ? ? ? ? alert("請選擇JPG或GIF格式的文件!");
? ? ? ? ? return (false);
? ? ? ? }else{
? ? ? ? document.all("loadImg").src=theform.file1.value
? ? ? ?
? ? ? ? if(document.all("loadImg").offsetWidth!=132&&document.all("loadImg").offsetHeight!=99){
? ? ? ? alert("您選擇的圖片大小:"+document.all("loadImg").offsetWidth+"X"+document.all("loadImg").offsetHeight+"\n"+"請選擇132X99大小的圖片")
? ? ? ? return (false)
? ? ? ? }
? ? ? ? }
? ? ? ?
? ? ? ? }
? ? ? ?
? ? ? ? }
? ? ? ? </script>
? ? ? ? <form onSubmit="return mysubmit(this)" name="form" method="post"
? ? ? ? enctype="multipart/form-data">
? ? ? ? <table width="100%" border=0 cellspacing=0 cellpadding=0>
? ? ? ? <tr><td valign=top height=30>
? ? ? ? <input type="hidden" name="act" value="upload">
? ? ? ? ? ? <input type="file" style="BORDER-TOP-WIDTH: 1px;
? ? ? ? BORDER-LEFT-WIDTH: 1px; FONT-SIZE: 12px; BORDER-BOTTOM-WIDTH: 1px;
? ? ? ? CURSOR: text; COLOR: #333333; FONT-FAMILY: "MS Shell Dlg",
? ? ? ? ","Tahoma", ","宋體"; HEIGHT: 20px; BORDER-RIGHT-WIDTH: 1px
? ? ? ? " name="file1" value="">
? ? ? ? ? ? <input type="submit" name="Submit" value="上傳" >
? ? ? ? ? ? </td>
? ? ? ? ? </tr>
? ? ? ? </table>
? ? ? ? <img id=loadImg>
? ? ? ? </form>
? ? ? ? 7,檢測一個圖片的長寬尺寸
? ? ? ? <script>
? ? ? ? var img=null;
? ? ? ? function s()
? ? ? ? {
? ? ? ? if(img)img.removeNode(true);
? ? ? ? img=document.createElement("img");
? ? ? ? img.style.position="absolute";
? ? ? ? img.style.visibility="hidden";
? ? ? ? img.attachEvent("onreadystatechange",orsc);
? ? ? ? img.attachEvent("onerror",oe);
? ? ? ? document.body.insertAdjacentElement("beforeend",img);
? ? ? ? img.src=inp.value;
? ? ? ? }
? ? ? ? function oe()
? ? ? ? {
? ? ? ? alert("cant load img");
? ? ? ? }
? ? ? ? function orsc()
? ? ? ? {
? ? ? ? if(img.readyState!="complete")return false;
? ? ? ? alert("高:"+img.offsetHeight+"\n寬:"+img.offsetWidth);
? ? ? ? }
? ? ? ? </script>
? ? ? ? <input type="file" Name="file" id="inp" value="默認值"><br><input
? ? ? ? οnclick="s()" type="button" value="點我一下給出要上傳圖片的大小及長、寬"
name="button">
? ? ? ? 8,按比例縮小
? ? ? ? <script defer>
? ? ? ? for (var i=0;i<document.images.length;i++){
? ? ? ? document.images.width=document.images.width*0.5
? ? ? ? }
? ? ? ? </script>
? ? ? ? <img src="img/wallpaper.jpg">
? ? ? ? 9,類似Acdsee看大圖的時的拖動
? ? ? ? <html>
? ? ? ? <head>
? ? ? ? <title>Untitled ? Document</title>
? ? ? ? <meta ? http-equiv="Content-Type" ? content="text/html; ?
? ? ? ? charset=gb2312">
? ? ? ? <script ? language="JavaScript">
? ? ? ? <!--
? ? ? ? var ? scrollcount=0;
? ? ? ? var ? dragy;
? ? ? ? var ? scrollarrowtop;
? ? ? ? function ? initdrag() ? {
? ? ? ? scrollcount=1;
? ? ? ? dragy=event.clientY;
? ? ? ? document.body.setCapture();
? ? ? ? }
? ? ? ? function ? startdrag() ? {
? ? ? ? if ? (scrollcount==1) ? {
? ? ? ? window.scrollBy(dragy-event.clientX,dragy-event.clientY);
? ? ? ? document.body.style.cursor='hand';
? ? ? ? dragy=event.clientY;
? ? ? ? }
? ? ? ? }
? ? ? ? function ? enddrag() ? {
? ? ? ? document.body.style.cursor='';
? ? ? ? scrollcount=0;
? ? ? ? document.body.releaseCapture();
? ? ? ? }
? ? ? ? // ? -->
? ? ? ? </script>
? ? ? ? </head>
? ? ? ? <body ? bgcolor="#FFFFFF" ? text="#000000" ?
? ? ? ? onselectstart="return ? false;" ? οnmοusedοwn="initdrag()" ?
? ? ? ? οnmοusemοve="startdrag()" ? οnmοuseup="enddrag()" ? scroll=yes>
? ? ? ? <img ? ? src="img/wallpaper.jpg"> ?
? ? ? ? <img ? ? src="img/whitney.jpg">
? ? ? ? </body>
? ? ? ? </html>
? ? ? ? 10,選擇圖片產生縮略圖,最多10個
? ? ? ? <html>
? ? ? ? <head>
? ? ? ? <title>Upload Image</title>
? ? ? ? <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
? ? ? ? <SCRIPT language=Javascript>
? ? ? ? gFlag=false;
? ? ? ? var
? ? ? ? gMaxSize,gCurrentSize,gUploadSize,gCurInputIndex,gCurImageSrc,gCurOFile;
? ? ? ? gMaxSize="10";
? ? ? ? gCurrentSize=".18";
? ? ? ? gMaxSize=parseFloat(gMaxSize)*1024*1024;
? ? ? ? //gMaxSize=parseFloat("1")*1024;
? ? ? ? gCurrentSize=parseFloat(gCurrentSize)*1024*1024;
? ? ? ? gErr="";
? ? ? ? gUploadSize=0;
? ? ? ?
? ? ? ? ? ? function validate()
? ? ? ? ? ? {
? ? ? ? ? ? var lErr;
? ? ? ? ? ? lErr="";
? ? ? ? ? ? ? if((gUploadSize+gCurrentSize)>gMaxSize){
? ? ? ? ? ? ? ? if(form1.TempAlbum.value!=form1.OldAlbum.value){
? ? ? ? ? ? ? ? ? lErr=".您要上傳的圖片尺寸大于您的剩余相冊容量,請選擇上傳至\"臨時相冊\"\n"+lErr;
? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? ? ? if(form1.OldAlbum.value=="0"){
? ? ? ? ? ? ? ? if(form1.NewAlbum.value.length==0){
? ? ? ? ? ? ? ? ? lErr=".請輸入新相冊名稱\n"+lErr;
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? }
? ? ? ? ? ? ? if(lErr.length>0){
? ? ? ? ? ? ? ? alert("錯誤:\n"+lErr);
? ? ? ? ? ? ? ? if(lErr.indexOf("請輸入新相冊名稱\n\n")!=-1){
? ? ? ? ? ? ? ? ? ? form1.NewAlbum.focus();
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? return false;
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ? form1.submit();
? ? ? ? ? ? ? ? /*進度條控制*/
? ? ? ? ? ? ? ? //var
? ? ? ? winProgress=window.open("progress.htm","progress","width=300,height=250");
? ? ? ? ? ? ? ? //winProgress.focus();
? ? ? ? ? ? ? ? /*進度條控制*/
? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ? return true;
? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? function handleBadImage() {
? ? ? ? ? ? alert('所選圖片并非有效的JPG格式!\n請重新選擇!');
? ? ? ? ? ? eval("form1.file"+gCurInputIndex+".outerHTML=\"<input
? ? ? ? type=\\\"file\\\" name=\\\"file"+gCurInputIndex+"\\\"
? ? ? ? style=\\\"width:275\\\" value=\\\"\\\"
? ? ? ? onChange=\\\"FileChange(this);\\\">\"");
? ? ? ? ? ?
eval("form1.file"+gCurInputIndex+".fireEvent(\"onChange\")");
? ? ? ? ? ? return false;
? ? ? ? ? }
? ? ? ? ?
? ? ? ? ? function handleGoodImage() {
? ? ? ? ? ? imgsrc='<img src="'+gCurImageSrc+'"
? ? ? ? οnlοad="DrawImage(this,'+gCurInputIndex+'); " width="0"
height="0">';
? ? ? ? ? ? gCurOFile.parentNode.previousSibling.innerHTML=imgsrc;
? ? ? ? ? ? return true;
? ? ? ? ? }
? ? ? ? ? //
? ? ? ? ? ? function FileChange(oFile){
? ? ? ? ? ? gErr="";
? ? ? ? ? ? gUploadSize=0;
? ? ? ? ? ? str='';
? ? ? ? ? ? gCurOFile=oFile;
? ? ? ? ? ? gCurImageSrc=oFile.value;
? ? ? ? ? ? inputname=oFile.name;
? ? ? ? ? ? i=inputname.substr((inputname.length-1),1);
? ? ? ? ? ? gCurInputIndex=i;
? ? ? ? ? ?
? ? ? ? ? ? if (gCurImageSrc.length>0){
? ? ? ? ? ? ? ? //check for none jpg
? ? ? ? ? ? ? ? imgExt=new Image();
? ? ? ? ? ? ? ? imgExt.οnlοad=handleGoodImage;
? ? ? ? ? ? ? ? imgExt.οnerrοr=handleBadImage;
? ? ? ? ? ? ? ? var fileName = gCurImageSrc.replace("\\", "/"); // NN7
? ? ? ? ? ? ? ? var imgURL = 'file:///' + fileName;
? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ? if((navigator.appVersion.indexOf('Mac')>-1) &&
? ? ? ? (navigator.appVersion.indexOf('MSIE')>-1)){
? ? ? ? ? ? ? ? ? imgURL='file://' + fileName;
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? imgExt.src=imgURL;
? ? ? ? ? ? ? ? //finish check
? ? ? ? ? ? ?
? ? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? ? function ShowImgOfServer(NewPath,ImgD){
? ? ? ? ? ? ImgD.src=NewPath;
? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? /
? ? ? ? ? function DrawImage(ImgD,Index){
? ? ? ? ? var flag=false;
? ? ? ? ? ? var image=new Image();
? ? ? ? ? ? image.src=ImgD.src;
? ? ? ? ? ? ImgD.value=ImgD.src;
? ? ? ? ? ? if(image.fileSize>2048000){
? ? ? ? ? ? ? image.outerHTML="";
? ? ? ? ? ? ? gErr+="此圖片尺寸過大,圖片尺寸應小于2MB\n";
? ? ? ? ? ? ? eval("form1.file"+Index+".outerHTML=\"<input
? ? ? ? type=\\\"file\\\" name=\\\"file"+Index+"\\\" style=\\\"width:275\\\"
? ? ? ? value=\\\"\\\" onChange=\\\"FileChange(this);\\\">\"");
? ? ? ? ? ? ? eval("form1.file"+Index+".fireEvent(\"onChange\")");
? ? ? ? ? ? ? alert("此圖片尺寸過大,圖片尺寸應小于2MB\n");
? ? ? ? ? ? ? return ;
? ? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? if(image.src.substr(image.src.length-3,3).toLowerCase()!="jpg"){
? ? ? ? ? ? ? image.outerHTML="";
? ? ? ? ? ? ? gErr+="此圖片類型不匹配,只能上傳JPG(JPEG)格式文件\n";
? ? ? ? ? ? ? eval("form1.file"+Index+".outerHTML=\"<input
? ? ? ? type=\\\"file\\\" name=\\\"file"+Index+"\\\" style=\\\"width:275\\\"
? ? ? ? value=\\\"\\\" onChange=\\\"FileChange(this);\\\">\"");
? ? ? ? ? ? ? eval("form1.file"+Index+".fireEvent(\"onChange\")");
? ? ? ? ? ? ? alert("此圖片類型不匹配,只能上傳JPG(JPEG)格式文件\n");
? ? ? ? ? ? ? return ;
? ? ? ? ? ? ? }
? ? ? ? ? ? ? tempFileName=image.src;
? ? ? ? ? ? ? var iLastDot;
? ? ? ? ? ? ? iLastLine=tempFileName.lastIndexOf('/');
? ? ? ? ? ? ? if(iLastLine!=-1){
? ? ? ? ? ? ? ?
? ? ? ? tempFileName=tempFileName.substring(iLastLine+1,tempFileName.length);
? ? ? ? ? ? ? }
? ? ? ? ? ? if(!CheckIfEnglish(tempFileName)){
? ? ? ? ? ? ? image.outerHTML="";
? ? ? ? ? ? ? gErr+="此圖片文件名包含中文或其他不合法字符\n文件名只能由'a-z'、'A-Z'、'_'、'-'構成\n";
? ? ? ? ? ? ? eval("form1.file"+Index+".outerHTML=\"<input
? ? ? ? type=\\\"file\\\" name=\\\"file"+Index+"\\\" style=\\\"width:275\\\"
? ? ? ? value=\\\"\\\" onChange=\\\"FileChange(this);\\\">\"");
? ? ? ? ? ? ? eval("form1.file"+Index+".fireEvent(\"onChange\")");
? ? ? ? ? ? ?
alert("此圖片文件名包含中文或其他不合法字符\n文件名只能由'a-z'、'A-Z'、'_'、'-'構成\n");
? ? ? ? ? ? ? return ;
? ? ? ? ? ? }
? ? ? ? ? ? if(gErr.length>0){
? ? ? ? ? ? ? return;
? ? ? ? ? ? ? }
? ? ? ? ? ? if(image.width>0 && image.height>0){
? ? ? ? ? ? flag=true;
? ? ? ? ? ? if(image.width/image.height>= 120/80){
? ? ? ? ? ? ? if(image.width>120){
? ? ? ? ? ? ? ImgD.width=120;
? ? ? ? ? ? ? ImgD.height=(image.height*120)/image.width;
? ? ? ? ? ? ? }else{
? ? ? ? ? ? ? ImgD.width=image.width;
? ? ? ? ? ? ? ImgD.height=image.height;
? ? ? ? ? ? ? }
? ? ? ? ? ? ? ImgD.alt="圖片大小(寬*高):
? ? ? ? "+image.width+"×"+image.height+"\n圖片大小: "+image.fileSize+"\n圖片路徑:
? ? ? ? "+image.src;
? ? ? ? ? ? ? eval('document.all.width'+Index+'.value='+image.width);
? ? ? ? ? ? ? eval('document.all.height'+Index+'.value='+image.height);
? ? ? ? ? ? ? var oCreated=new Date(image.fileModifiedDate);
? ? ? ? ? ? ?
? ? ? ? eval('document.all.PicUpdateDate'+Index+'.value="'+oCreated.toLocaleString()+'"');
? ? ? ? ? ? ? }
? ? ? ? ? ? else{
? ? ? ? ? ? ? if(image.height>80){
? ? ? ? ? ? ? ImgD.height=80;
? ? ? ? ? ? ? ImgD.width=(image.width*80)/image.height; ?
? ? ? ? ? ? ? }else{
? ? ? ? ? ? ? ImgD.width=image.width;
? ? ? ? ? ? ? ImgD.height=image.height;
? ? ? ? ? ? ? }
? ? ? ? ? ? ? ImgD.alt="圖片大小(寬*高):
? ? ? ? "+image.width+"×"+image.height+"\n圖片大小: "+image.fileSize+"\n圖片路徑:
? ? ? ? "+image.src;
? ? ? ? ? ? ? eval('document.all.width'+Index+'.value='+image.width);
? ? ? ? ? ? ? eval('document.all.height'+Index+'.value='+image.height);
? ? ? ? ? ? ? var oCreated=new Date(image.fileModifiedDate);
? ? ? ? ? ? ?
? ? ? ? ? ? ?
? ? ? ? eval('document.all.PicUpdateDate'+Index+'.value="'+oCreated.toLocaleString()+'"');
? ? ? ? ? ? ? }
? ? ? ? ? ? ?
? ? ? ? ? ? }
? ? ? ? ? ? ? ? ?
? ? ? ? ? ? ? if(parseInt(Index)==parseInt(form1.upcount.value)){
? ? ? ? ? ? ? ? ? form1.upcount.value=parseInt(form1.upcount.value)+1;
? ? ? ? ? ? ? ? ? str+='<table width="100%" ><tr valign="middle" ><td
? ? ? ? align="center" id="tdimg" height="" width="120" ></td><td
? ? ? ? id="tdfile" >文件'+(parseInt(Index)+1)+':<input
? ? ? ? onpropertychange="FileChange(this);" type="file"
? ? ? ? name="file'+(parseInt(Index)+1)+'" style="width:275" ><input
? ? ? ? id="width'+(parseInt(Index)+1)+'"
? ? ? ? name="width'+(parseInt(Index)+1)+'" type="hidden" value=""><input
? ? ? ? id="height'+(parseInt(Index)+1)+'"
? ? ? ? name="height'+(parseInt(Index)+1)+'" type="hidden" value=""><input
? ? ? ? name="PicUpdateDate'+(parseInt(Index)+1)+'" type="hidden"
? ? ? ? id="PicUpdateDate'+(parseInt(Index)+1)+'"></td></tr></table>';
? ? ? ? ? ? ? ? ?
? ? ? ? window.upid.insertAdjacentHTML("beforeEnd",str+'<br>');
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? gUploadSize+=parseFloat(image.fileSize);
? ? ? ? ? ? ? }
? ? ? ? ? //
? ? ? ? ? ? function AlbumChange(Value){
? ? ? ? ? ? if(Value=='0'){
? ? ? ? ? ? document.all.sNewAlbum.style.display='inline';
? ? ? ? ? ? document.all.NewAlbum.focus();
? ? ? ? ? ? }
? ? ? ? ? ? else{
? ? ? ? ? ? document.all.sNewAlbum.style.display='none';
? ? ? ? ? ? }
? ? ? ? ? ? return ;
? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? ?
? ? ? ? function CheckIfEnglish( String )
? ? ? ? {
? ? ? ? ? var Letters =
? ? ? ? "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890-_.";
? ? ? ? ? var i;
? ? ? ? ? var c;
? ? ? ? ? ? if(String.charAt( 0 )=='-')
? ? ? ? ? return false;
? ? ? ? ? ? if( String.charAt( String.length - 1 ) == '-' )
? ? ? ? ? ? ? return false;
? ? ? ? ? for( i = 0; i < String.length; i ++ )
? ? ? ? ? {
? ? ? ? ? ? ? c = String.charAt( i );
? ? ? ? ? ? if (Letters.indexOf( c ) < 0)
? ? ? ? ? ? ? return false;
? ? ? ? ? }
? ? ? ? ? return true;
? ? ? ? }
? ? ? ? </SCRIPT>
? ? ? ? </head>
? ? ? ? <body >
? ? ? ? <form name="form1" method="post" action="">
? ? ? ? <TABLE align=center bgColor=#cccccc border=0
? ? ? ? ? ? ? ? ? ? ? ? ? ? borderColorDark=#cccccc
? ? ? ? borderColorLight=#000000
? ? ? ? ? ? ? ? ? ? ? ? ? ? cellPadding=5 cellSpacing=1
? ? ? ? height=367
? ? ? ? ? ? ? ? ? ? ? ? ? ? width="500">
? ? ? ? ? <TBODY>
? ? ? ? ? ? <TR vAlign=center>
? ? ? ? ? ? <TD align=left bgColor=#ffffff colSpan=2
? ? ? ? ? ? ? ? ? ? ? ? ? ? height=269 id=upid vAlign=top>
? ? ? ? <TABLE cellPadding=3 cellSpacing=1 width="100%">
? ? ? ? ? ? ? ? <TBODY>
? ? ? ? ? ? ? ? <TR vAlign=center>
? ? ? ? ? ? ? ? ? <TD align=middle bgColor=#ffffff id=tdimg
? ? ? ? ? ? ? ? ? ? ? ? ? ? width=120></TD>
? ? ? ? ? ? ? ? ? <TD bgColor=#ffffff id=tdfile>文件1:
? ? ? ? ? ? ? ? ? ? <INPUT
? ? ? ? ? ? ? ? ? ? ? ? ? ? name=file1
? ? ? ? onpropertychange=FileChange(this);
? ? ? ? ? ? ? ? ? ? ? ? ? ? style="WIDTH: 275px" type=file>
? ? ? ? <INPUT id=width1
? ? ? ? ? ? ? ? ? ? ? ? ? ? name=width1 type=hidden> <INPUT
? ? ? ? id=height1
? ? ? ? ? ? ? ? ? ? ? ? ? ? name=height1 type=hidden> <INPUT
? ? ? ? ? ? ? ? ? ? ? ? ? ? id=PicUpdateDate1
? ? ? ? name=PicUpdateDate1
? ? ? ? ? ? ? ? ? ? ? ? ? ? type=hidden></TD>
? ? ? ? ? ? ? ? </TR>
? ? ? ? ? ? ? ? </TBODY>
? ? ? ? ? ? ? </TABLE></TD>
? ? ? ? ? ? </TR>
? ? ? ? ? ? <TR bgColor=#eeeeee vAlign=center>
? ? ? ? ? ? <TD align=middle bgColor=#ebebeb colSpan=2
? ? ? ? ? ? ? ? ? ? ? ? ? ? height=24> <DIV
? ? ? ? align=left>將圖片上傳至已有相冊
? ? ? ? ? ? ? ? <SELECT id=OldAlbum
? ? ? ? ? ? ? ? ? ? ? ? ? ? name=OldAlbum
? ? ? ? οnchange=AlbumChange(this.value);>
? ? ? ? ? ? ? ? <OPTION value=0><新建相冊></OPTION>
? ? ? ? ? ? ? ? <OPTION
? ? ? ? ? ? ? ? ? ? ? ? ? ? selected value=365>臨時相冊</OPTION>
? ? ? ? ? ? ? ? </SELECT>
? ? ? ? ? ? ? ? <INPUT
? ? ? ? ? ? ? ? ? ? ? ? ? ? id=TempAlbum name=TempAlbum
? ? ? ? type=hidden
? ? ? ? ? ? ? ? ? ? ? ? ? ? value=365>
? ? ? ? ? ? ? ? <SPAN id=sNewAlbum
? ? ? ? ? ? ? ? ? ? ? ? ? ? style="DISPLAY: none">或新建相冊
? ? ? ? ? ? ? ? <INPUT id=NewAlbum
? ? ? ? ? ? ? ? ? ? ? ? ? ? maxLength=50 name=NewAlbum
? ? ? ? οnfοcus="">
? ? ? ? ? ? ? ? </SPAN></DIV></TD>
? ? ? ? ? ? </TR>
? ? ? ? ? ? <TR bgColor=#eeeeee vAlign=center>
? ? ? ? ? ? <TD align=middle bgColor=#ebebeb colSpan=2
? ? ? ? ? ? ? ? ? ? ? ? ? ? height=24> <DIV align=center><FONT
? ? ? ? size=2>
? ? ? ? ? ? ? ? <INPUT class=bt name=Submit οnclick=validate();
? ? ? ? type=button value="· 上傳已選圖片 ·">
? ? ? ? ? ? ? ? <INPUT id=upcount name=upcount type=hidden
? ? ? ? ? ? ? ? ? ? ? ? ? ? value=1>
? ? ? ? ? ? ? ? <INPUT id=from name=from type=hidden>
? ? ? ? ? ? ? ? </FONT></DIV></TD>
? ? ? ? ? ? </TR>
? ? ? ? ? </TBODY>
? ? ? ? </TABLE>
? ? ? ? </form>
? ? ? ? </body>
? ? ? ? </html>
? ? ? ? 11,不同的ALT
? ? ? ? <SCRIPT language=JavaScript1.2>
? ? ? ? <!--
? ? ? ? tPopWait=50;
? ? ? ? tPopShow=50000;
? ? ? ? showPopStep=10;
? ? ? ? popOpacity=100;
? ? ? ? sPop=null;
? ? ? ? curShow=null;
? ? ? ? tFadeOut=null;
? ? ? ? tFadeIn=null;
? ? ? ? tFadeWaiting=null;
? ? ? ? document.write("<style type='text/css'id='defaultPopStyle'>");
? ? ? ? document.write(".cPopText { background-color: #FFFFFF; border: 1px
? ? ? ? #000000 solid; font-size: 12px; padding-right: 4px; padding-left:
? ? ? ? 4px; height: 20px; padding-top: 2px; padding-bottom: 2px; filter:
? ? ? ? Alpha(Opacity=0)}");
? ? ? ? document.write("</style>");
? ? ? ? document.write("<div id='dypopLayer'
? ? ? ? style='position:absolute;z-index:1000;' class='cPopText'></div>");
? ? ? ? function showPopupText(){
? ? ? ? var o=event.srcElement;
? ? ? ? MouseX=event.x;
? ? ? ? MouseY=event.y;
? ? ? ? if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""};
? ? ? ? if(o.dypop!=sPop) {
? ? ? ? sPop=o.dypop;
? ? ? ? clearTimeout(curShow);
? ? ? ? clearTimeout(tFadeOut);
? ? ? ? clearTimeout(tFadeIn);
? ? ? ? clearTimeout(tFadeWaiting);
? ? ? ? if(sPop==null || sPop=="") {
? ? ? ? dypopLayer.innerHTML="";
? ? ? ? dypopLayer.style.filter="Alpha()";
? ? ? ? dypopLayer.filters.Alpha.opacity=0;
? ? ? ? }
? ? ? ? else {
? ? ? ? if(o.dyclass!=null) popStyle=o.dyclass
? ? ? ? else popStyle="cPopText";
? ? ? ? curShow=setTimeout("showIt()",tPopWait);
? ? ? ? }
? ? ? ? }
? ? ? ? }
? ? ? ? function showIt(){
? ? ? ? dypopLayer.className=popStyle;
? ? ? ? dypopLayer.innerHTML=sPop;
? ? ? ? popWidth=dypopLayer.clientWidth;
? ? ? ? popHeight=dypopLayer.clientHeight;
? ? ? ? if(MouseX+12+popWidth>document.body.clientWidth)
? ? ? ? popLeftAdjust=-popWidth-24
? ? ? ? else popLeftAdjust=0;
? ? ? ? if(MouseY+12+popHeight>document.body.clientHeight)
? ? ? ? popTopAdjust=-popHeight-24
? ? ? ? else popTopAdjust=0;
? ? ? ? dypopLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust;
? ? ? ? dypopLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust;
? ? ? ? dypopLayer.style.filter="Alpha(Opacity=0)";
? ? ? ? fadeOut();
? ? ? ? }
? ? ? ? function fadeOut(){
? ? ? ? if(dypopLayer.filters.Alpha.opacity<popOpacity) {
? ? ? ? dypopLayer.filters.Alpha.opacity+=showPopStep;
? ? ? ? tFadeOut=setTimeout("fadeOut()",1);
? ? ? ? }
? ? ? ? else {
? ? ? ? dypopLayer.filters.Alpha.opacity=popOpacity;
? ? ? ? tFadeWaiting=setTimeout("fadeIn()",tPopShow);
? ? ? ? }
? ? ? ? }
? ? ? ? function fadeIn(){
? ? ? ? if(dypopLayer.filters.Alpha.opacity>0) {
? ? ? ? dypopLayer.filters.Alpha.opacity-=1;
? ? ? ? tFadeIn=setTimeout("fadeIn()",1);
? ? ? ? }
? ? ? ? }
? ? ? ? document.οnmοuseοver=showPopupText;
? ? ? ? //-->
? ? ? ? </script>
? ? ? ? <img src="images/logo.gif" alt="網頁教學網">
總結
以上是生活随笔為你收集整理的网页图片处理代码全集整理的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 写好项目文档有多重要?关于我被百大 UP
- 下一篇: WEB超链分析算法纵览