下面的代码是一个相册的展示效果。目前的问题是如何共用这段代码到  tab菜品  ,tab环境等下面,
因为有很多id啊,不能单纯复制解决问题了                <div id="cnt_album_0">
                    <div class="albums_pic">
                        <div class="albums_pic_l" id='spanP_2' onclick='changePageIndex("p");'>
                        </div>
                        <div class="albums_pic_cont text2">
                            <ul id="imgPreviewSlider_0">
                                <li>
                                    <img id='imgOne' onclick='changeSrc(this.src,0,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                                </li>
                                <li>
                                    <img id='imgTwo' onclick='changeSrc(this.src,1,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                                </li>
                                <li>
                                    <img id='imgThree' onclick='changeSrc(this.src,2,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                                </li>
                                <li>
                                    <img id='imgFour' onclick='changeSrc(this.src,3,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                                </li>
                                <li>
                                    <img id='imgFive' onclick='changeSrc(this.src,4,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                            </ul>
                        </div>
                        <div class="albums_pic_r" id='spanN' onclick='changePageIndex("n");'>
                        </div>
                        <input id="batch_0" type="hidden" value="1" begin="1">
                    </div>
                    <input id="flag_0" type="hidden" value="1">
                    <div class="albums_page text8">
                        第<span id='spanCurrent'>0</span>/<span id='spanLength'>0</span>张
                    </div>
                    <div class="albums_cont">
                        <img id='imgO' /></div>
                    <div class="blank10">
                    </div>
                    <div class="clear">
                    </div>
                    <div class="albums_title text1">
                        <ul class="albums_title_t">
                            <li>
                                <label>
                                    照片名称:</label><span><strong id="pic_title_0"><span id="msgPhotoName"> </span></strong>
                                    </span>
                                <div class="albums_title_r text2">
                                    <%--<font id="pic_click_0">   </font> --%>
                                    浏览数:<div style="display: inline" id="msgViewTime">
                                    </div>
                                    次
                                </div>
                            </li>
                        </ul>
                        <ul class="albums_title_t">
                            <li>
                                <label>
                                    更新时间:</label><span id="pic_update_0"><span id="msgUpdateTime"> </span></span>
                            </li>
                        </ul>
                        <ul>
                            <li>
                                <label>
                                    照片简介:</label><span class="text1" id="pic_description_0"><span id="msgPhotoInfo"> </span>
                                    </span></li>
                        </ul>
                    </div>
                    <div class="blank10">
                    </div>
                    <div class="st_l_bot">
                    </div>
                </div>

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>Imgmove</title>
    <style type="text/css">
    a{ background-color:#EFEBEF;width:100px; height:135px; display:inline-table; zoom:1; text-align:center;text-decoration:none;
    border-left:1px solid #EFEBEF; border-right:1px solid #EFEBEF}
    a.cc{background-color:#FFFFFF;width:100px; height:135px; display:inline-table; zoom:1; text-align:center;text-decoration:none; color:#000000; border-left:1px solid #CECBCE; border-right:1px solid #CECBCE}
    a:hover{background-color:#FFFFFF;width:100px; height:135px; display:inline-table; zoom:1; text-align:center;text-decoration:none; color:#000000}
    #container{
    width:976px;
    }
    #container span{ display: block; margin-top:20px; margin-bottom:10px;}
    #left{
    width:29px;
    height:137px;
    float:left;
    background-image:url("http://album.hi.csdn.net/app_uploads/wtcsy/20090618/232729109.p.jpg");
    background-position: -0px 0px;
    }
    #middle{
    border-bottom:1px solid #CECBCE;
    border-top:1px solid #CECBCE;
    width:918px;
    height:135px;
    float:left;
    background-color: #EFEBEF;
    overflow:hidden;
    }
    #right{
    width:29px;
    height:137px;
    float:left;
    background-image:url("http://album.hi.csdn.net/app_uploads/wtcsy/20090618/232744390.p.jpg");
    background-position: -29px 0px;
    }
    #thumblist{}
    #middle img {
    border:1px solid #999999;
    }
    </style>
    </head>
    <body style=" padding:10px; padding-top:150px; margin:0px; font-size:12px;">
    <!--<div id='nn' style=" text-align:center; font-size:16px; color:#0000FF">聚焦第5个</div>-->
    <div id="container">
        <div id="left"></div>
        <div id="middle">
            <div id="thumblist">
        <a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/langl/thumb_sm.jpg"></span>郎朗</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/tianlm/thumb_sm.jpg"></span>田黎明</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/caizz1/thumb_sm.jpg"></span>蔡志忠(一)</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/caizz2/thumb_sm.jpg"></span>蔡志忠(二)</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/jimmy/thumb_sm.jpg"></span>幾米</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/yanbo/thumb_sm.jpg"></span>闫博</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/yangch/thumb_sm.jpg"></span>杨长槐</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/zhangdl/thumb_sm.jpg"></span>张大力</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/liujl/thumb_sm.jpg"></span>刘静兰</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/hayq/thumb_sm.jpg"></span>哈亦琦</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/tailp/thumb_sm.jpg"></span>邰立平</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/mengsf/thumb_sm.jpg"></span>孟树锋</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/xihd/thumb_sm.jpg"></span>西合道</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/yesy/thumb_sm.jpg"></span>叶水云</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/xuzc/thumb_sm.jpg"></span>徐竹初</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/tanping/thumb_sm.jpg"></span>谭平</a><a href="javascript:void(0)"><span><img src="http://www.google.cn/help/ig/art/images/themes/pangk/thumb_sm.jpg"></span>潘公凯</a>
            </div>
        </div>
        <div id="right"></div>
    </div>
    <!--<div style="clear:both; padding-top:20px;">
    <input value='聚焦第1个' type="button" onclick="sss(1)" />
    <input value='聚焦第2个' type="button" onclick="sss(2)" />
    <input value='聚焦第3个' type="button" onclick="sss(3)" />
    <input value='聚焦第4个' type="button" onclick="sss(4)" />
    <input value='聚焦第5个' type="button" onclick="sss(5)" />
    <input value='聚焦第6个' type="button" onclick="sss(6)" />
    <input value='聚焦第7个' type="button" onclick="sss(7)" />
    <input value='聚焦第8个' type="button" onclick="sss(8)" />
    <input value='聚焦第9个' type="button" onclick="sss(9)" />
    </div>-->
    <script type="text/javascript">
    document.all&&document.execCommand("BackgroundImageCache", false, true); var isIE = (document.all) ? true : false;var $ = function (id) {
     return  document.getElementById(id);
    };var Extend = function(destination, source) {
     for (var property in source) {
      destination[property] = source[property];
     }
    }var Bind = function(object, fun,args) {
     return function() {
      return fun.apply(object,args||[]);
     }
    }var BindAsEventListener = function(object, fun) {
     var args = Array.prototype.slice.call(arguments).slice(2);
     return function(event) {
      return fun.apply(object, [event || window.event].concat(args));
     }
    }var CurrentStyle = function(element){
     return element.currentStyle || document.defaultView.getComputedStyle(element, null);
    }var Tween = {
        Quart: {
                easeOut: function(t,b,c,d){
                    return -c * ((t=t/d-1)*t*t*t - 1) + b;
                }
            }
    } function create(elm,parent,fn){var element = document.createElement(elm);fn&&fn(element); parent&&parent.appendChild(element);return element};
     function addListener(element,e,fn){ element.addEventListener?element.addEventListener(e,fn,false):element.attachEvent("on" + e,fn)};
     function removeListener(element,e,fn){ element.removeEventListener?element.removeEventListener(e,fn,false):element.detachEvent("on" + e,fn)}; var Class = function(properties){
           var _class = function(){return (arguments[0] !== null && this.initialize && typeof(this.initialize) == 'function') ? this.initialize.apply(this, arguments) : this;};
           _class.prototype = properties;
           return _class;
     };var  Imgroll =new Class({
    options:{
    Isrun   : false,
    Step    : 100,
    Time    : 10,
    t       : 0,
    b       : 0,
    c       : 0,
    d       : 60,
    Tween   : Tween.Quart.easeOut,
    Oninit  : function(){},
    Onstart : function(){},
    Onstop  : function(){}
    },
    initialize:function(obj,c,total,i,options){
    this._obj   = obj;        
    this._c     = c;
    this._total  = total;    //显示区域有多少张图片
    this.i      = i ;        //聚焦于第i张图片
    this.timer  = null;
    this.Isrun  = this.options.isrun;
    this.Step   = this.options.Step;
    this.Time   = this.options.Time;
    this.t      = this.options.t;
    this.b      = this.options.b;
    this.c      = this.options.c;
    this.d      = this.options.d;
    this.Tween  = this.options.Tween;
    this.Oninit = this.options.Oninit;
    this.Onstart= this.options.Onstart;
    this.Onstop = this.options.Onstop;
    Extend(this,options||{});
    var self =this, i = 0,img = this._c.getElementsByTagName('a');
    this._c.style.width = img.length*this.Step+'px';
    for(;i<img.length;i++)

    img[i].num = i;
    (function(i){
     addListener(img[i],'click',Bind(self,self.Start,[img[i]]));
     })(i);
    }
    },
    Start:function(c){
    if(this.Isrun)return;
    this.Isrun = true;
    var img = this._c.getElementsByTagName('a')
    this.b     = this._obj.scrollLeft;     
    c&&(this.c = c.num<this.i?(-1)*this.b:(c.num>img.length-(this._total-this.i+1)-1?(img.length - this._total)*this.Step - this.b:(c.num-this.i+1)*this.Step-this.b));
    this.Onstart(c);
    if(this.c==0){this.Isrun=false;return;}
    this.Run();
    },
    Run:function(){
    if(this.t<this.d)
    {
    this.RunTo(Math.round(this.Tween(++this.t,this.b,this.c,this.d)))
    this.timer = setTimeout(Bind(this,this.Run),this.Time)
    }
    else
    {
    this.RunTo(this.b+this.c);
    this.Stop();
    }
    },
    RunTo:function(i){
    this._obj.scrollLeft = i;
    },
    Pre:function(){
    this.c = this.Step*(-1);
    this.Start();
    },
    Next:function(){
    this.c = this.Step;
    this.Start();
    },
    Stop:function(){
    clearTimeout(this.timer);
    this.t = 0;this.Isrun=false;
    this.Onstop()
    }
    }) var ss = new Imgroll($('middle'),$('thumblist'),9,5,{
            Step:102,
    Onstart:function(obj){
    if(!obj)return;
    this.o&&(this.o.className='');
    this.o=obj;
    obj.className ='cc';
        },
    Onstop:function(){
    $('left').style.backgroundPosition=this._obj.scrollLeft == 0?"0px 0px":"-29px 0px";
    $('right').style.backgroundPosition=this._obj.scrollLeft== 816?"0px 0px":"-29px 0px";
         }});
    addListener($('right'),'click',function(){ss.Next()});
    addListener($('left'),'click',function(){ss.Pre()});
    function sss(num){
    ss.i=num;
    $('nn').innerHTML = "聚焦第"+num+"个"
    }
    </script>
    </body>
    </html>
      

  2.   

    不大怎么明白
    id很多,那你改下ID不就可以?
    能用到一个tab上面,肯定其他的也可以套用
    每个tab对应相应的id不就可以了?
      

  3.   

        <!--相册内容-->
                     <script><%=ccccc%></script>
                         <%-- -------------------begin--%>    <script>
            function $$(id) {
                return document.getElementById(id);
            }
            var pageSize = 5;
            var currentPageIndex = 0;
            var pageCount = 0;        function changeSrc(src, num, photoName, viewTime, updateTime, photoInfo) {
                $$('spanCurrent').innerHTML = currentPageIndex * pageSize + 1 + num;
                $$('imgO').src = src.replace('_100.jpg', '.jpg');
                $$('msgPhotoName').innerHTML = photoName;
                $$('msgViewTime').innerHTML = viewTime;
                $$('msgUpdateTime').innerHTML = updateTime;
                $$('msgPhotoInfo').innerHTML = photoInfo;
            }        function changePageIndex(str) {            if ((str == 'p' && currentPageIndex < 1) || (str == 'n' && currentPageIndex > pageCount - 2)) {
                    return;
                }
                if (str == 'p') {
                    currentPageIndex = currentPageIndex < 1 ? 1 : currentPageIndex - 1;
                }
                else {
                    if (typeof imgArray != 'undefined' && imgArray instanceof Array) {
                        currentPageIndex = currentPageIndex > pageCount - 2 ? pageCount : currentPageIndex + 1;
                    }
                }
                initinit();
            }    </script>    <script>
            function strToArray(temp) {
                var result = temp;
                return result;
            }
            function initinit() {
                if (typeof imgArray != 'undefined' && imgArray instanceof Array) {                //为了能看到效果,可以取消
                    $$('imgOne').src = '';
                    $$('imgTwo').src = '';
                    $$('imgThree').src = '';
                    $$('imgFour').src = '';
                    $$('imgFive').src = '';
                    $$('imgOne').src = strToArray(imgArray[currentPageIndex * pageSize])[0];
                    $$('imgOne').photoName = strToArray(imgArray[currentPageIndex * pageSize])[1]; //  $$('pic_title_0').innerHTML = imgArray
                    $$('imgOne').viewTime = strToArray(imgArray[currentPageIndex * pageSize])[2];
                    $$('imgOne').updateTime = strToArray(imgArray[currentPageIndex * pageSize])[3];
                    $$('imgOne').photInfo = strToArray(imgArray[currentPageIndex * pageSize])[4];                if (currentPageIndex * pageSize + 1 >= imgArray.length) {
                        $$('imgTwo').style.display = "none";
                    }
                    else {
                        $$('imgTwo').style.display = "";
                        $$('imgTwo').src = strToArray(imgArray[currentPageIndex * pageSize + 1])[0];
                        $$('imgTwo').photoName = strToArray(imgArray[currentPageIndex * pageSize + 1])[1]; //  $$('pic_title_0').innerHTML = imgArray
                        $$('imgTwo').viewTime = strToArray(imgArray[currentPageIndex * pageSize + 1])[2];
                        $$('imgTwo').updateTime = strToArray(imgArray[currentPageIndex * pageSize + 1])[3];
                        $$('imgTwo').photInfo = strToArray(imgArray[currentPageIndex * pageSize + 1])[4];                }                if (currentPageIndex * pageSize + 2 >= imgArray.length) {
                        $$('imgThree').style.display = "none";
                    }
                    else {
                        $$('imgThree').style.display = "";
                        $$('imgThree').src = strToArray(imgArray[currentPageIndex * pageSize + 2])[0];
                        $$('imgThree').photoName = strToArray(imgArray[currentPageIndex * pageSize + 2])[1]; //  $$('pic_title_0').innerHTML = imgArray
                        $$('imgThree').viewTime = strToArray(imgArray[currentPageIndex * pageSize + 2])[2];
                        $$('imgThree').updateTime = strToArray(imgArray[currentPageIndex * pageSize + 2])[3];
                        $$('imgThree').photInfo = strToArray(imgArray[currentPageIndex * pageSize + 2])[4];
                    }                if (currentPageIndex * pageSize + 3 >= imgArray.length) {
                        $$('imgFour').style.display = "none";
                    }
                    else {
                        $$('imgFour').style.display = "";
                        $$('imgFour').src = strToArray(imgArray[currentPageIndex * pageSize + 3])[0];
                        $$('imgFour').photoName = strToArray(imgArray[currentPageIndex * pageSize + 3])[1]; //  $$('pic_title_0').innerHTML = imgArray
                        $$('imgFour').viewTime = strToArray(imgArray[currentPageIndex * pageSize + 3])[2];
                        $$('imgFour').updateTime = strToArray(imgArray[currentPageIndex * pageSize + 3])[3];
                        $$('imgFour').photInfo = strToArray(imgArray[currentPageIndex * pageSize + 3])[4];
                    }                if (currentPageIndex * pageSize + 4 >= imgArray.length) {
                        $$('imgFive').style.display = "none";
                    }
                    else {
                        $$('imgFive').style.display = "";
                        $$('imgFive').src = strToArray(imgArray[currentPageIndex * pageSize + 4])[0];
                        $$('imgFive').photoName = strToArray(imgArray[currentPageIndex * pageSize + 4])[1]; //  $$('pic_title_0').innerHTML = imgArray
                        $$('imgFive').viewTime = strToArray(imgArray[currentPageIndex * pageSize + 4])[2];
                        $$('imgFive').updateTime = strToArray(imgArray[currentPageIndex * pageSize + 4])[3];
                        $$('imgFive').photInfo = strToArray(imgArray[currentPageIndex * pageSize + 4])[4];
                    }                $$('spanLength').innerHTML = imgArray.length;
                }
            } //end function init
            initinit();        if (typeof imgArray != 'undefined' && imgArray instanceof Array) {
                $$('imgO').src = $$('imgOne').src.replace('_100.jpg', '.jpg');            pageCount = imgArray.length % pageSize == 0 ? imgArray.length / pageSize : Math.floor(imgArray.length / pageSize) + 1;
                $$('spanCurrent').innerHTML = 1;
            }
            $$('msgPhotoName').innerHTML = strToArray(imgArray[currentPageIndex * pageSize])[1];
            $$('msgViewTime').innerHTML = strToArray(imgArray[currentPageIndex * pageSize])[2];
            $$('msgUpdateTime').innerHTML = strToArray(imgArray[currentPageIndex * pageSize])[3];
            $$('msgPhotoInfo').innerHTML = strToArray(imgArray[currentPageIndex * pageSize])[4];
                            
        </script>    <%--  -------------------end--%>
                    <div id="cnt_album_0">
                        <div class="albums_pic">
                            <div class="albums_pic_l" id='spanP' onclick='changePageIndex("p");'>
                            </div>
                            <div class="albums_pic_cont text2">
                                <ul id="imgPreviewSlider_0">
                                    <li>
                                        <img id='imgOne' onclick='changeSrc(this.src,0,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                                    </li>
                                    <li>
                                        <img id='imgTwo' onclick='changeSrc(this.src,1,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                                    </li>
                                    <li>
                                        <img id='imgThree' onclick='changeSrc(this.src,2,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                                    </li>
                                    <li>
                                        <img id='imgFour' onclick='changeSrc(this.src,3,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                                    </li>
                                    <li>
                                        <img id='imgFive' onclick='changeSrc(this.src,4,this.photoName,this.viewTime,this.updateTime,this.photoInfo);' />
                                </ul>
                            </div>
                            <div class="albums_pic_r" id='spanN' onclick='changePageIndex("n");'>
                            </div>
                            <input id="batch_0" type="hidden" value="1" begin="1">
                        </div>
                        <input id="flag_0" type="hidden" value="1">
                        <div class="albums_page text8">
                            第<span id='spanCurrent'>0</span>/<span id='spanLength'>0</span>张
                        </div>
                        <div class="albums_cont">
                            <img id='imgO' /></div>
                        <div class="blank10">
                        </div>
                        <div class="clear">
                        </div>
                        <div class="albums_title text1">
                            <ul class="albums_title_t">
                                <li>
                                    <label>
                                        照片名称:</label><span><strong id="pic_title_0"><span id="msgPhotoName"> </span></strong>
                                        </span>
                                    <div class="albums_title_r text2">
                                        <%--<font id="pic_click_0">   </font> --%>
                                        浏览数:<div style="display: inline" id="msgViewTime">
                                        </div>
                                        次
                                    </div>
                                </li>
                
                                    <label>
       
      

  4.   

      <script><%=ccccc%></script>
                         <%-- -------------------begin--%>    <script>
            function $$(id) {
                return document.getElementById(id);
            }
            var pageSize = 5;
            var currentPageIndex = 0;
            var pageCount = 0;        function changeSrc(src, num, photoName, viewTime, updateTime, photoInfo) {
                $$('spanCurrent').innerHTML = currentPageIndex * pageSize + 1 + num;
                $$('imgO').src = src.replace('_100.jpg', '.jpg');
                $$('msgPhotoName').innerHTML = photoName;
                $$('msgViewTime').innerHTML = viewTime;
                $$('msgUpdateTime').innerHTML = updateTime;
                $$('msgPhotoInfo').innerHTML = photoInfo;
            }        function changePageIndex(str) {            if ((str == 'p' && currentPageIndex < 1) || (str == 'n' && currentPageIndex > pageCount - 2)) {
                    return;
                }
                if (str == 'p') {
                    currentPageIndex = currentPageIndex < 1 ? 1 : currentPageIndex - 1;
                }
                else {
                    if (typeof imgArray != 'undefined' && imgArray instanceof Array) {
                        currentPageIndex = currentPageIndex > pageCount - 2 ? pageCount : currentPageIndex + 1;
                    }
                }
                initinit();
            }    </script>    <script>
            function strToArray(temp) {
                var result = temp;
                return result;
            }
            function initinit() {
                if (typeof imgArray != 'undefined' && imgArray instanceof Array) {                //为了能看到效果,可以取消
                    $$('imgOne').src = '';
                    $$('imgTwo').src = '';
                    $$('imgThree').src = '';
                    $$('imgFour').src = '';
                    $$('imgFive').src = '';
                    $$('imgOne').src = strToArray(imgArray[currentPageIndex * pageSize])[0];
                    $$('imgOne').photoName = strToArray(imgArray[currentPageIndex * pageSize])[1]; //  $$('pic_title_0').innerHTML = imgArray
                    $$('imgOne').viewTime = strToArray(imgArray[currentPageIndex * pageSize])[2];
                    $$('imgOne').updateTime = strToArray(imgArray[currentPageIndex * pageSize])[3];
                    $$('imgOne').photInfo = strToArray(imgArray[currentPageIndex * pageSize])[4];                if (currentPageIndex * pageSize + 1 >= imgArray.length) {
                        $$('imgTwo').style.display = "none";
                    }
                    else {
                        $$('imgTwo').style.display = "";
                        $$('imgTwo').src = strToArray(imgArray[currentPageIndex * pageSize + 1])[0];
                        $$('imgTwo').photoName = strToArray(imgArray[currentPageIndex * pageSize + 1])[1]; //  $$('pic_title_0').innerHTML = imgArray
                        $$('imgTwo').viewTime = strToArray(imgArray[currentPageIndex * pageSize + 1])[2];
                        $$('imgTwo').updateTime = strToArray(imgArray[currentPageIndex * pageSize + 1])[3];
                        $$('imgTwo').photInfo = strToArray(imgArray[currentPageIndex * pageSize + 1])[4];                }                if (currentPageIndex * pageSize + 2 >= imgArray.length) {
                        $$('imgThree').style.display = "none";
                    }
                    else {
                        $$('imgThree').style.display = "";
                        $$('imgThree').src = strToArray(imgArray[currentPageIndex * pageSize + 2])[0];
                        $$('imgThree').photoName = strToArray(imgArray[currentPageIndex * pageSize + 2])[1]; //  $$('pic_title_0').innerHTML = imgArray
                        $$('imgThree').viewTime = strToArray(imgArray[currentPageIndex * pageSize + 2])[2];
                        $$('imgThree').updateTime = strToArray(imgArray[currentPageIndex * pageSize + 2])[3];
                        $$('imgThree').photInfo = strToArray(imgArray[currentPageIndex * pageSize + 2])[4];
                    }                if (currentPageIndex * pageSize + 3 >= imgArray.length) {
                        $$('imgFour').style.display = "none";
                    }
                    else {
                        $$('imgFour').style.display = "";
                        $$('imgFour').src = strToArray(imgArray[currentPageIndex * pageSize + 3])[0];
                        $$('imgFour').photoName = strToArray(imgArray[currentPageIndex * pageSize + 3])[1]; //  $$('pic_title_0').innerHTML = imgArray
                        $$('imgFour').viewTime = strToArray(imgArray[currentPageIndex * pageSize + 3])[2];
                        $$('imgFour').updateTime = strToArray(imgArray[currentPageIndex * pageSize + 3])[3];
                        $$('imgFour').photInfo = strToArray(imgArray[currentPageIndex * pageSize + 3])[4];
                    }                if (currentPageIndex * pageSize + 4 >= imgArray.length) {
                        $$('imgFive').style.display = "none";
                    }
                    else {
                        $$('imgFive').style.display = "";
                        $$('imgFive').src = strToArray(imgArray[currentPageIndex * pageSize + 4])[0];
                        $$('imgFive').photoName = strToArray(imgArray[currentPageIndex * pageSize + 4])[1]; //  $$('pic_title_0').innerHTML = imgArray
                        $$('imgFive').viewTime = strToArray(imgArray[currentPageIndex * pageSize + 4])[2];
                        $$('imgFive').updateTime = strToArray(imgArray[currentPageIndex * pageSize + 4])[3];
                        $$('imgFive').photInfo = strToArray(imgArray[currentPageIndex * pageSize + 4])[4];
                    }                $$('spanLength').innerHTML = imgArray.length;
                }
            } //end function init
            initinit();        if (typeof imgArray != 'undefined' && imgArray instanceof Array) {
                $$('imgO').src = $$('imgOne').src.replace('_100.jpg', '.jpg');            pageCount = imgArray.length % pageSize == 0 ? imgArray.length / pageSize : Math.floor(imgArray.length / pageSize) + 1;
                $$('spanCurrent').innerHTML = 1;
            }
            $$('msgPhotoName').innerHTML = strToArray(imgArray[currentPageIndex * pageSize])[1];
            $$('msgViewTime').innerHTML = strToArray(imgArray[currentPageIndex * pageSize])[2];
            $$('msgUpdateTime').innerHTML = strToArray(imgArray[currentPageIndex * pageSize])[3];
            $$('msgPhotoInfo').innerHTML = strToArray(imgArray[currentPageIndex * pageSize])[4];
                            
        </script>    <%--  -------------------end--%>