欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

發(fā)一個自己用JS寫的實用看圖工具實現(xiàn)代碼

 更新時間:2008年07月26日 13:15:12   作者:  
所以決定慢慢來照顧一下博客吧,這里先把眼前就有的一個小東西拿出來和大家分享一下,這是2006年的時候(文本里記下了時間,不然也忘記了)為了自己看網(wǎng)絡(luò)圖片方便而寫的。
  因為某些網(wǎng)站把內(nèi)容圖片以每頁顯示一幅的形式呈現(xiàn),而每頁都有大量沒用的垃圾信息(廣告、新聞和無關(guān)圖片),非常影響看圖效率。所以寫了這個,只要知道第一幅圖片的URL,填在本網(wǎng)頁里,設(shè)置一下起始和結(jié)束編號,就可以顯示帶有數(shù)字編號的圖片了,同時還有一些常用到的貼心功能。當然,對于某些網(wǎng)站存放的無序圖片就無能為力了。

  介紹完了,下面是代碼內(nèi)容,希望能對JS新手們有點幫助吧(請自行把下面代碼里所有的“'”替換為單引號。我對這里這個格式實在沒轍了):
復(fù)制代碼 代碼如下:

<SCRIPT>
//CTRL+鼠標滾輪放大或縮小圖片:
function imgzoom(o) {
    if(event.ctrlKey) {
        var zoom = parseInt(o.style.zoom, 10) || 100;
        zoom -= event.wheelDelta / 12;
        if(zoom > 0) {
            o.style.zoom = zoom + &apos;%&apos;;
        }
        return false;
    } else {
        return true;
    }
}
//接收熱鍵
document.onkeydown=mykey;
var IsShow=false;
function  mykey()
{
    var  key=window.event.keyCode;
//    alert(key);
    if (key==192){
        if (IsShow) showIt();
            else hideIt();
//        IsShow=!IsShow;
    }    //45=Insert鍵,16=Shift,17=Ctrl,18=Alt,192=`
    if (key==13 ) catchIt();//Enter,to display
    if (key==186)  document.getElementById(&apos;add0&apos;).checked=!document.getElementById(&apos;add0&apos;).checked;
}

function hideIt()
{    IsShow=true;
    //隱藏
//    document.getElementById(&apos;showHere&apos;).style.visibility=&apos;hidden&apos;;    //保留占用的顯示面積
    document.getElementById(&apos;showHere&apos;).style.display=&apos;none&apos;;        //回收占用的顯示面積
//    document.getElementById(&apos;imgUrlBackup&apos;).innerText=document.getElementById(&apos;thePath&apos;).value;
//    document.getElementById(&apos;thePath&apos;).value=&apos;&apos;;
}

function showIt()
{    IsShow=false;
    //顯示
//    document.getElementById(&apos;showHere&apos;).style.visibility="visible";
    document.getElementById(&apos;showHere&apos;).style.display="";
//    document.getElementById(&apos;thePath&apos;).value=document.getElementById(&apos;imgUrlBackup&apos;).innerText;
}

function catchIt()
{
    ////document.write(&apos;<p><table>&apos;);
    showIt()
    var sn=Number(document.getElementById(&apos;startNum&apos;).value);
    var en=Number(document.getElementById(&apos;endNum&apos;).value);
    var str=document.getElementById(&apos;thePath&apos;).value;
    var IsAdd0=document.getElementById(&apos;add0&apos;).checked;
    var lastPos;
    var Discript=&apos;<center>按1旁邊的“`”鍵可隱藏/顯示圖片區(qū)域。點擊圖片可在新窗口查看原圖。CTRL+鼠標滾輪可放大或縮小圖片。</center>&apos;;
    var showSth=&apos;<table>&apos;;
    var fn=&apos;&apos;;
    fn=&apos;&apos;;
    if (IsAdd0)
    {
        lastPos=str.lastIndexOf(&apos;#&apos;);
         str=str.replace(new RegExp(&apos;#&apos;,&apos;ig&apos;),&apos;0&apos;);
        for(var n=sn;n<=en;n++)
        {
            fn=str.substring(0,lastPos-String(n).length+1) + n + str.substring(lastPos+1);
            showSth=showSth+GetImgSrc(fn);
        }
    }
    else
    {
        for(var n=sn;n<=en;n++)
        {
            fn=str.replace(&apos;#&apos;,n);
            showSth=showSth+GetImgSrc(fn);
        }
    }
    showSth=showSth+&apos;</table>&apos;;
//    alert(showSth);
    document.getElementById(&apos;showHere&apos;).innerHTML=Discript+showSth+Discript;
    //    document.refresh();
    IsShow=false;
}

function GetImgSrc(ImgUrl)
{    //讓圖片載入后自動調(diào)整顯示尺寸以適應(yīng)屏幕,并提取文件體積信息附加到提示信息上
    //在鼠標經(jīng)過時,設(shè)置鼠標為手形狀
    //在鼠標點擊時,在新窗口打開圖片
    //鼠標滾輪滾動時,觸發(fā)縮放圖片函數(shù)
    //設(shè)置圖片的提示信息
    return &apos; <img onerror="javascript:this.style.display=\&apos;none\&apos;;"  src="&apos; + ImgUrl  + &apos;" onload="if(this.width >screen.width*0.7) {this.resized=true; this.width=screen.width*0.7;DispImgInfo(this);}" onmouseover="if(this.resized) this.style.cursor=&apos;hand&apos;;" onclick="window.open(this.src);" onmousewheel="return imgzoom(this);" alt="URL:&apos; + ImgUrl + &apos; 點擊=在新窗口查看,CTRL+鼠標滾輪=縮放圖片" >&apos;;
}

//把所有圖片按thesize文本框指定比例進行縮放
function ImgZoom(Operation) {
    var ScaleTo=document.getElementById(&apos;thesize&apos;).value/100;
    if (Operation=="toBig") {ScaleTo=1+ScaleTo;}
    for(var i=0;i<document.images.length;i++)
    {    document.images[i].width=document.images[i].width*ScaleTo;
        //不用改變高度,會自動跟隨長度變化而等比變化.
    }
}


//  寬:&apos;+this.width+&apos;,高:&apos;+this.height+&apos;,&apos;+getImgsize(this)+&apos;

function DispImgInfo(img) {
    if (img.src!=null && img.src!="")
            img.alt=img.alt + " 寬:"+img.width+",高:"+img.height+",大小:"+getImgsize(img);
}

function discAllimages() {
    //getAllimages
    for (var i=0; i<document.images.length; i++)
    {    var img=document.images[i];
        if (img.src!=null && img.src!="")
            img.alt=img.alt + " 寬:"+img.width+",高:"+img.height+",大小:"+getImgsize(img);
    }
}

function getImgsize(x) {
    var picSize=x.fileSize;
    if (picSize>1000) picSize=Math.round(picSize/1024*100)/100+&apos;KB&apos;;
    else if (picSize > 0) picSize=picSize+&apos;字節(jié)&apos;;
    else picSize=&apos;未知&apos;;
    return picSize;
}
</SCRIPT>


作者:ZhaoLiang -- 碧海情天、淹沒天空的海  郵箱:thedoc01@163.com   制作時間:2006年8月
<BR>功能:批量顯示帶數(shù)字編號的本地或網(wǎng)絡(luò)圖片。如 C:A##.gif 或 file:///C:/A##.gif 或 http://www.cctv.com/A3#.jpg
<BR>說明:如圖片名稱是A02而非A2時,可用##指定編號的固定長度并選擇“固位補零”,則不足位的會自動用0補齊)
<BR>熱鍵:`(~)鍵=顯示開/關(guān)。;鍵=開關(guān)固位補零。圖片上CTRL+鼠標滾輪=縮放圖片。點擊圖片=在新窗口打開。HOME=篇幅較長時可返回開頭。
<HR>
路徑:<INPUT id=&apos;thePath&apos; style="apos: " type=&apos;text&apos;></INPUT>
起始編號:<INPUT id=&apos;startNum&apos; style="apos: " type=&apos;text&apos;></INPUT>
結(jié)束編號:<INPUT id=&apos;endNum&apos; style="apos: " type=&apos;text&apos;></INPUT><BR>
<INPUT id=&apos;add0&apos; type=&apos;checkbox&apos;></INPUT>固位補零
 <INPUT onclick=javascript:catchIt() type=&apos;button&apos; value=&apos;顯示之&apos;></INPUT>
<!--  <input type=&apos;button&apos; id=&apos;see&apos; onclick="javascript:showIt()" value=&apos;再顯示&apos;></input>
-->
<INPUT onclick=javascript:ImgZoom(&apos;toSmall&apos;) type=&apos;button&apos; value=&apos;縮小&apos;></INPUT>
<INPUT onclick=javascript:ImgZoom(&apos;toBig&apos;) type=&apos;button&apos; value=&apos;放大&apos;></INPUT>
縮放比例(百分之):<INPUT id=&apos;thesize&apos; style="apos: " type=&apos;text&apos; value=50>(回車即顯示圖片)
<!--  <input type=&apos;button&apos; onclick="javascript:discAllimages()" value="顯示圖片信息">
-->
<HR>
<DIV id=&apos;showHere&apos;></DIV>
<DIV id=&apos;imgUrlBackup&apos; style="DISPLAY: none; apos: "></DIV>

<SCRIPT>
    document.getElementById(&apos;thePath&apos;).focus();
</SCRIPT>
<!--
作者:ZhaoLiang -- 碧海情天、淹沒天空的海  郵箱:thedoc01@163.com
看顯示區(qū)代碼javascript:alert(document.getElementById(&apos;showHere&apos;).innerHTML);
-->

平時也不注意整理,所以這個文件改過幾個不同版本,發(fā)完了我才想起,曾經(jīng)把hideIt()和showit()合并成一個函數(shù)(根據(jù)參數(shù)進行處理就行了),還有其它一些細節(jié)。因為對這里的編輯還不太熟,就不再改了,大家有興趣自己試試吧。如果有什么建議能提供的話就更好了。

(更新:修改了一下,對于不存在的圖片,自動隱藏,不占據(jù)顯示空間——通過img的onerror事件進行處理。 
另外要說的,這里現(xiàn)在這個代碼編輯器,很容易導(dǎo)致編輯后的內(nèi)容大亂套。我花了很長時間來改正錯誤的替換代碼,感覺比我寫這個腳本工具都累。而且,里面SPAN的生成,完全沒有優(yōu)化,不必要的重復(fù)數(shù)量簡直驚人,希望OpenSoft開發(fā)組盡快完善。)

相關(guān)文章

最新評論