Dedecms实现键盘方向键翻页效果教程

时间:2016-02-19

DEDECMS教程之实现按键盘方向键实现上一页/下一页翻页效果,这样可以提高用户体验,特别是在小说站和图片站中用的比较多。

DEDECMS教程之键盘翻页的制作方法:

打开 include/arc.archives.class.php 查找到以下代码:

  1. $this->PreNext['pre'] = "上一篇:<a href='$mlink'>{$preRow['title']}</a> "; 

替换成以下代码:

  1. $this->PreNext['pre'] = "$mlink ";$this->PreNext['next'] = "下一篇:<a href='$mlink'>{$nextRow['title']}</a> "; 

然后在内容页用js进行调用,代码如下:

  1. <script type="text/javascript" language="javascript"> 
  2. <!--  
  3. document.onkeydown=nextpage;  
  4. var prevpage='{dede:prenext get='pre'/}';  
  5. var nextpage='{dede:prenext get='next'/}';  
  6. var index_page = "index.html";  
  7. //var bookpage="index.html";  
  8. function nextpage(event)  
  9. {  
  10. eventevent = event ? event : (window.event ? window.event : null);  
  11. //if (event.keyCode==13) location=bookpage 
  12. if (event.keyCode==13) location=index_page 
  13. if (event.keyCode==37)  
  14. {  
  15. if (prevpage!='' && prevpage!='上一篇:没有了 ')  
  16. location=prevpage;  
  17. else  
  18. alert('这是第一页');  
  19. }  
  20. if (event.keyCode==39)  
  21. {  
  22. if (nextpage!='' && nextpage!='下一篇:没有了 ')  
  23. location=nextpage;  
  24. else  
  25. alert('已经是最后一页了');  
  26. }  
  27. }  
  28. //--> 
  29. function getElement(aID)  
  30. {  
  31. return (document.getElementById) ? document.getElementById(aID): document.all[aID];  
  32. }  
  33. function makeRequest(url){  
  34. http_request=false;  
  35. if(window.XMLHttpRequest){//Mozilla,Safari,...  
  36. http_request=new XMLHttpRequest();  
  37. if(http_request.overrideMimeType){  
  38. http_request.overrideMimeType('text/xml');  
  39. }  
  40. }else if(window.ActiveXObject){//IE  
  41. try{  
  42. http_request=new ActiveXObject("Msxml2.XMLHTTP");  
  43. }catch(e){  
  44. try{  
  45. http_request=new ActiveXObject("Microsoft.XMLHTTP");  
  46. }catch(e){}  
  47. }  
  48. }  
  49. if(!http_request){  
  50. alert('Giving up:(Cannot create an XMLHTTP instance)');  
  51. return false;  
  52. }  
  53. return http_request;  
  54. }  
  55. </script> 

加入到文章模版的<body>标签之前的内容就行了。

当然为了防止页面代码臃肿,大家可以将此代码放在单独JS文件中采用外部调用即可,保持页面简洁清爽。

DEDECMS教程之实现按键盘方向键实现上一页/下一页翻页效果制作完毕!

本文来源:矮油设计

上一条:去除Dedecms列表页文章标题加粗效果 下一条:DedeCMS转换WordPress方法-亲测成功

相关文章

最新文章