Home > Article > CMS Tutorial > How to Realize Dream Weaving Album Click on the picture to turn the page
How to realize the page turning of the album by clicking on the picture of Dreamweaver?
Dream Weaver DEDECMS implements the function of clicking on a picture to turn pages in the atlas
Recommended learning: Dream Weaver cms
1. In order to achieve For this function, we first need to obtain the current page number and total page number of the image page
Edit the include/inc_archives_view.php file
(1) Find function ParseDMFields and modify it to:
function ParseDMFields($pageNo,$ismake=1) { $this->NowPage = $pageNo; //获得当前页面编号 $this->Fields['cpagenum'] = $this->NowPage; if($this->SplitPageField!="" && isset($this->Fields[$this->SplitPageField])) { $this->Fields[$this->SplitPageField] = $this->SplitFields[$pageNo - 1]; }
Note that the following code has been added to obtain the current page number:
$this->Fields['cpagenum'] = $this->NowPage;
(2) Find the function __construct constructor and modify it to:
$this->TotalPage = count($this->SplitFields); } //获得当前页面总数 $this->Fields['totalpage'] = $this->TotalPage; $this->LoadTemplet(); $this->ParseTempletsFirst(); }
Note that the following code has been added to obtain the total page number:
$this->Fields['totalpage'] = $this->TotalPage;
2. Next, use js in the template to analyze static pages and dynamic pages and page down
Edit article_image.htm or the template that is finally displayed in your album, and add the following js code:
<script language="javascript"> var npage = {dede:field/}; var totalpage = {dede:field/}; 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/}"; } else{ location.href = "view.php?aid={dede:field/}&pageno="+(npage+1); } } } </script>
In this js script, we define a method goNextPic to switch to the next picture.
3. Finally modify the image output code and complete the goNextPic method call
Modify include/inc_channel_unit.php
Find "//All listed or paginated atlases" part.
The modification is similar (look at the code carefully, you need to modify several places):
$revalue = "<center><a href='$src' target='_blank'><img src='$src' alt='$alt' $iw/></a><br/>$alt<br/></center>\r\n";
is:
$revalue = "<center><a href='javascript:goNextPic();'><img src='$src' alt='$alt' $iw/></a><br/>$alt<br/></center> ";
The above is the detailed content of How to Realize Dream Weaving Album Click on the picture to turn the page. For more information, please follow other related articles on the PHP Chinese website!