如何实现phpcms轮播

今天就跟大家聊聊有关如何实现phpcms轮播，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

phpcms实现轮播的方法：首先在想要加轮播图的位置加入"

...

"；然后根据自己的需求对css样式进行更改；最后在需要实现轮播的地方加入js代码即可。

phpcms首页实现轮播图

1.在你想要加轮播图的位置加入以下

          
                                                                        
          
        
           {pc:content  action="position" posid="1" thumb="1" order="listorder DESC" num="5"}        {loop $data $r}        
        {/loop}        {/pc}        
        {pc:content  action="lists" catid="" thumb="1" order="listorder DESC" num="5"}        {loop $data $r}        
{str_cut($r[title],20)}
        {/loop}        {/pc}        
        
        
        
 <>     

由于这个焦点幻灯比较特殊，图片和文字需要两次调用，另外，后台添加内容时要勾选首页焦点图推荐，就可以添加到首页

2.当然，这里面的css样式根据自己的需求做更改，在这里就不贴出css代码了，实现轮播需要加入以下js代码

_window.onload=function(){//获取元素    var flowDiagram = document.getElementById('flowDiagram');//容器    var photo = document.getElementById("photo");    var button = document.getElementById("button").getElementsByTagName('span');    var pre = document.getElementById("pre");    var next = document.getElementById("next");    var index = 1;    var m;    function move(){        m = setInterval(next.onclick,3000);    }    function stop(){        if(m)clearInterval(m);    }    function buttonlight(){        for (var i = 0; i < button.length; i++) {            if(button[i].className == "on"){                button[i].className = "";                break;            }        }        button[index-1].className = "on";    }    pre.onclick=function() {        if (index == 1)            index = 5;        else              index = index - 1;        buttonlight();        photo.style.left = parseInt(photo.style.left) + 1200 + "px";        if (parseInt(photo.style.left) > -1200){            photo.style.left = -6000 + "px";       }    }    next.onclick = function(){//当right键被触发时响应        if (index == 5)            index = 1;        else            index = index + 1;        buttonlight();        photo.style.left = parseInt(photo.style.left) - 1200 + "px";        if (parseInt(photo.style.left) < -6000){            photo.style.left = -1200 + "px";        }    }    for (var i = 0; i < button.length; i++){        button[i].onclick = function()        {            if(this.className=="on")                return;            var currentindex = parseInt(this.getAttribute("index"));//getAttribute能获取自定义的属性值，也可以获取自带的属性值            var distance = currentindex - index;            photo.style.left = parseInt(photo.style.left) - 1200 * distance + "px";            index = currentindex;            buttonlight();        }    }    flowDiagram.onmouseover = stop;    flowDiagram.onmouseout = move;    move();}

最终效果

看完上述内容，你们对如何实现phpcms轮播有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注行业资讯频道，感谢大家的支持。