快捷導(dǎo)航

實(shí)現(xiàn)dedecms圖集單擊圖片翻頁的功能

更新時(shí)間：2008年03月23日 17:48:10 作者：

題記：在很多相冊(cè)的網(wǎng)站中，都有這樣的功能：當(dāng)圖片分多頁顯示的情況下，點(diǎn)擊圖片會(huì)自動(dòng)翻頁到下一張圖片，接下來我們?cè)赿edecms4中實(shí)現(xiàn)這個(gè)功能。以下是實(shí)現(xiàn)方法：

1、為了實(shí)現(xiàn)這個(gè)功能，我們首先需要獲得圖片頁面的當(dāng)前頁碼和總頁碼
編輯include/inc_archives_view.php文件

（1）找到function ParseDMFields，修改為：

function ParseDMFields($pageNo,$ismake=1)
     {
         $this->NowPage = $pageNo;
        //獲得當(dāng)前頁面編號(hào)
         $this->Fields['cpagenum'] = $this->NowPage;
         if($this->SplitPageField!="" &&
           isset($this->Fields[$this->SplitPageField]))
         {
             $this->Fields[$this->SplitPageField] = $this->SplitFields[$pageNo - 1];
         }
注意增加了如下代碼用來獲得當(dāng)前的頁碼:
$this->Fields['cpagenum'] = $this->NowPage;

（2）找到function __construct構(gòu)造函數(shù)，修改為：

<?php
……
             $this->TotalPage = count($this->SplitFields);
         }
        //獲得當(dāng)前頁面總數(shù)
         $this->Fields['totalpage'] = $this->TotalPage;
         $this->LoadTemplet();
         $this->ParseTempletsFirst();
     }
注意增加了如下代碼用來獲得總頁碼:
$this->Fields['totalpage'] = $this->TotalPage;

2、接下來在模板中用js實(shí)現(xiàn)分析靜態(tài)頁面和動(dòng)態(tài)頁面以及向下翻頁

編輯article_image.htm或者你的圖集最終顯示的模板，增加如下js代碼：

<script language="javascript">
    var npage = {dede:field name='cpagenum'/};
    var totalpage = {dede:field name='totalpage'/};
    var filename="";
    var curl=location.href;

function goNextPic(){
    str1 = /\.html/ig;
    str2 = /_/ig;
    r = curl.search(str1);
    r1 = curl.search(str2);
    if(r>0){
        if(npage==1) filename = curl.substr(0,r);
        else filename = curl.substr(0,r1);

        if(npage==totalpage){ location.href = filename+".html"; }
        else{
            location.href = filename+"_"+(npage+1)+".html";
        }
    }else{
        if(npage==totalpage){ location.href = "view.php?aid={dede:field name='id'/}"; }
        else{
            location.href = "view.php?aid={dede:field name='id'/}&pageno="+(npage+1);
        }
    }
}
</script>
在這個(gè)js腳本中，我們定義一個(gè)方法goNextPic用來切換到下一個(gè)圖片。

3、最后修改圖片輸出代碼，完成goNextPic方法調(diào)用

修改include/inc_channel_unit.php
找到”//全部列出式或分頁式圖集”的部分。
修改類似（仔細(xì)看代碼，需要修改好幾個(gè)地方）：

$revalue = "<center><a href='$src' target='_blank'><img src='$src' alt='$alt' $iw border='0'/></a><br/>$alt<br/></center>\r\n";
為：

$revalue = "<center><a href='javascript:goNextPic();'><img src='$src' alt='$alt' $iw border='0'/></a><br/>$alt<br/></center> ";

您可能感興趣的文章: