phpcms V9 广告模块 循环调用广告轮播(首个广告跟最后一个广告样式判断)

Posted 2020-09-27

先看一下百叶窗广告列表效果图：

在看一下html代码部分:

<div class="flash4" style="margin-top: 50px">

            
      <ul> 
	            		 
    	<li class="first" style="width: 538px;">
            <div class="imgTop"><img src="http://*.maifang158.com/uploadfile/2017/0705/20170705112019277.jpg" width="538" height="405" alt="新品分类" class="tm"></div>
            <div class="imgCen" style="display: block;">新品分类</div>
            <div class="imgBot"><a href="#"><p class="bt_1">新品分类</p><p class="bt_2" style="display: block;"><span>震撼来临</span></p></a></div>
        </li>
        		 
    	<li style="width: 107px;">
        	<div class="imgTop"><img src="http://*.maifang158.com/uploadfile/2017/0704/20170704064031577.jpg" width="538" height="405" alt="原创分类" class="tm"></div>
            <div class="imgCen" style="display: none;">原创分类</div>
            <div class="imgBot"><a href="#"><p class="bt_1">原创分类</p><p class="bt_2" style="display: none;"><span>原创分类</span></p></a></div>
        </li>
        		 
    	<li style="width: 107px;">
        	<div class="imgTop"><img src="http://*.maifang158.com/uploadfile/2017/0704/20170704063915862.jpg" width="538" height="405" alt="进口分类" class="tm"></div>
            <div class="imgCen" style="display: none;">进口分类</div>
            <div class="imgBot"><a href="#"><p class="bt_1">进口分类</p><p class="bt_2" style="display: none;"><span>进口分类</span></p></a></div>
        </li>
        		 
    	<li style="width: 107px;">
        	<div class="imgTop"><img src="http://*.maifang158.com/uploadfile/2017/0704/20170704063931264.jpg" width="538" height="405" alt="现货分类" class="tm"></div>
            <div class="imgCen" style="display: none;">现货分类</div>
            <div class="imgBot"><a href="#"><p class="bt_1">现货分类</p><p class="bt_2" style="display: none;"><span>现货分类</span></p></a></div>
        </li>
        		 
    	<li style="width: 107px;">
        	<div class="imgTop"><img src="http://*.maifang158.com/uploadfile/2017/0705/20170705112109720.jpg" width="538" height="405" alt="轻奢分类" class="tm"></div>
            <div class="imgCen" style="display: none;">轻奢分类</div>
            <div class="imgBot"><a href="#"><p class="bt_1">轻奢分类</p><p class="bt_2" style="display: none;"><span>轻奢分类</span></p></a></div>
        </li>
        		 
    	<li style="width: 107px;">
        	<div class="imgTop"><img src="http://*.maifang158.com/uploadfile/2017/0704/20170704063800847.jpg" width="538" height="405" alt="定制分类" class="tm"></div>
            <div class="imgCen" style="display: none;">定制分类</div>
            <div class="imgBot"><a href="#"><p class="bt_1">定制分类</p><p class="bt_2" style="display: none;"><span></span></p></a></div>
        </li>
        		 
    	<li class="fast" style="width: 107px;">
        	<div class="imgTop"><img src="http://*.maifang158.com/uploadfile/2017/0704/20170704063800847.jpg" width="538" height="405" alt="其他分类" class="tm"></div>
            <div class="imgCen" style="display: none;">其他分类</div>
            <div class="imgBot"><a href="#"><p class="bt_1">其他分类</p><p class="bt_2" style="display: none;"><span></span></p></a></div>
        </li>
            
      </ul>     
        

</div>

在来看一下标签调用：

      {pc:content  action="ads" spaceid="12" order="listorder ASC" num="7"}      
      <ul> 
	    {php $a=0;}
        {loop $data $r}
		{php $a++;} 
    	<li {if $a==1}class="first"{elseif $a==7}class="fast"{/if}>
        	<div class="imgTop"><img src="{$r[‘imageurl‘]}" width="538" height="405"  alt="{$r[‘title‘]}" class="tm"></div>
            <div class="imgCen">{$r[‘title‘]}</div>
            <div class="imgBot"><a href="{$r[‘url‘]}"><p class="bt_1">{$r[‘title‘]}</p><p class="bt_2"><span>{$r[‘alt‘]}</span></p></a></div>
        </li>
        {/loop}    
      </ul>     
      {/pc}

这里spaceid="12"，12是我这里的广告为ID，

这里的用{php $a=0;}{loop $data $r}{php $a++;}来做递增循环没有别的意思，就当作是7个广告按1-7排序输出，这里我们就可以用if来判断1-7个广告中的首个广告跟最后一个广告的样式了，并不需要输出$a。当$a==1;的时候就是首个广告，当$a==7;的时候就是最后一个广告。

下面的{$r[‘imageurl‘]}就是广告图片地址，{$r[‘title‘]}就是广告的标题，{$r[‘url‘]}就是广告链接，{$r[‘alt‘]}就是广告的文字说明了。

下面还是上一张图吧：

本文出自 “Jack_phpcms” 博客，请务必保留此出处http://maifang158.blog.51cto.com/5433990/1946794