欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

MPBrowser简易图片浏览器 v1.0

程序员文章站 2022-06-17 14:23:36
mpbrowser.js复制代码 代码如下:var thisimgno = 290; function ajaxconn(){ &n...
mpbrowser.js
复制代码 代码如下:

var thisimgno = 290;
function ajaxconn(){
    var xmlhttp = false;
    try{xmlhttp = new activexobject("msxml2.xmlhttp");}
    catch(e){try{xmlhttp = new activexobject("microsoft.xmlhttp");}
    catch(e){try{xmlhttp = new xmlhttprequest();}
    catch(e){alert(e);xmlhttp = false;}}}
    if(!xmlhttp)return null;
    this.connect = function(url,method,postcontent){
        if(!xmlhttp)return false;
        method = method.touppercase();
        try{
            if (method == "get"){
                xmlhttp.open(method,url + '?' + postcontent,true);
                xmlhttp.setrequestheader("content-type","text/html;charset=gb2312");
                svars = null;
            }else{
                xmlhttp.open(method,url,true);
                xmlhttp.setrequestheader("method","post "+url+" http/1.1");
                xmlhttp.setrequestheader("content-type","application/x-www-form-urlencoded");
            }
            xmlhttp.onreadystatechange = function(){
                if(xmlhttp.readystate == 4){
                    if(xmlhttp.status == 200){
                        imginfo = xmlhttp.responsetext;
                        var imginfoarr = imginfo.split("|");
                        var tmpimg = new image();
                        tmpimg.src = imginfoarr[0];
                        thisimgno = imginfoarr[1];
                        var element = document.getelementbyid("img");
                        if(!element.xpos)element.xpos = 0;
                        element.style.width = (element.clientwidth + 130) + "px";
                        slideelement("img",element.xpos-130,0,10);
                        element.innerhtml += '<a href="http://blog.mzoe.com/" target="_blank"><img height="90" width="120" alt="" src="'+imginfoarr[0]+'" /></a>';
                    }
                }
            }
            xmlhttp.send(postcontent);
        }catch(z){return false;}
        return true;
    }
    return this;
}
function loadimg(type){
    var element = document.getelementbyid("img");
    if(!element.xpos)element.xpos = 0;
    if(type=="pre"){
        if(element.xpos==0)return false;
        slideelement("img",element.xpos+130,0,10);
    }else{
        if(element.xpos==-(element.clientwidth - 260)){
            var myconn = new ajaxconn();
            if(!myconn)return false;
            myconn.connect("cmd.asp","get","d="+thisimgno);
        }else{
            slideelement("img",element.xpos-130,0,10);
        }
    }
}
function slideelement(elementid,x,y,inc){
    var element = document.getelementbyid(elementid);
    if(element.sliding)cleartimeout(element.sliding);
    if(!element.xpos)element.xpos = 0;
    if(!element.ypos)element.ypos = 0;
    if(element.xpos == x && element.ypos == y) return true;
    if(element.xpos > x){
        var dist = math.ceil((element.xpos-x)/inc);
        element.xpos = element.xpos - dist;
    }
    if(element.xpos < x) {
        var dist = math.ceil((x-element.xpos)/inc);
        element.xpos = element.xpos + dist;
    }
    if(element.ypos > y) {
        var dist = math.ceil((element.ypos-y)/inc);
        element.ypos = element.ypos - dist;
    }
    if(element.ypos < y) {
        var dist = math.ceil((y-element.ypos)/inc);
        element.ypos = element.ypos + dist;
    }
    element.style.left = element.xpos+'px';
    element.style.top = element.ypos+'px';
    element.sliding = settimeout('slideelement("'+elementid+'",'+x+','+y+','+inc+')',10);
}

mpbrowser主要的特点是无刷新,简单易用,代码也相当的简单,只有几kb的js代码,可以与任何的后台轻易整合,最后不臭美的说还有点好看(当然换个样式也相当的方便)。

  演示地址:http://www.mzoe.com/demo/mpbrowser/

  下载地址:http://www.mzoe.com/downfile/mpbrowser_v1.rar

  喜欢的朋友顶一下:d。