Heim > Web-Frontend > js-Tutorial > Hauptteil

JS-Methode, um einen zentrierten Paging-Effekt auf der aktuellen Seite zu erzielen

PHPz
Freigeben: 2018-10-12 16:12:13
Original
1353 Leute haben es durchsucht

Dieser Artikel stellt hauptsächlich die Methode von JS vor, um den Center-Paging-Effekt der aktuellen Seite zu erzielen, einschließlich verwandter Techniken zur Bedienung von Seitenelementen und -stilen mit Javascript. Freunde in Not können sich auf

function show_page(cur_pc)
{
  var cp=cur_pc;  //curent page count
  var tp=this.p;  //total page count
  var sp=this.pc;  //show page count
  var bp;      //begin page count
  var ep;      //end page count
  if(sp%2==0) sp=sp+1;   //this process need an odd number
  var dp=Math.floor(sp/2); //each side count to show
  var dif=tp-sp;  //check weather it have enough page to make mid-show
  var f=cp-dp;   //to check weather it has enough page to make mid-show from the begin
  var g=tp-(cp+dp); //to check weather it has enough page to make mid-show from the end
  if(sp && dif>=0)
  {
    if(g>0)
    {
      if(f>0)
      { 
        bp=f; 
        ep=cp+dp; 
      }
      else
      { 
        bp=1; 
        ep=2*dp+1; 
      }
    }
    else
    { 
      bp=tp-2*dp; 
      ep=tp; 
    }  
  }
  else
  { 
    bp=1; 
    ep=tp; 
  }
  var buf=[];
  for(var i=bp;i<=ep;i++)
  {
    if(i==cur_pc)
    {
      buf.push("<a href=&#39;javascript:;&#39; class=&#39;current&#39;>",i,"</a>");
    }
    else
    {
      buf.push("<a href=&#39;javascript:;&#39; class=&#39;normal&#39;>",i,"</a>");
    }
  }
  document.write(buf);
}
Nach dem Login kopieren

Der Laufeffekt ist wie folgt:

Weitere Tutorials finden Sie unter

JavaScript-Tutorial

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage