9.8.5制作标签文档

说明页

$app->block->find('about', 'labelcontent');

广告图

//广告列表
$app->ads->find(1);

// 广告中的单个图片
$app->ads->find(1, 1, 'uploadfiles');

// 示例代码：
<ul class="ads clearfix">
   <!--{foreach $app->ads->find(11) as $volist}-->
   <li>
       <a href="<!--{$volist.url}-->">
           <img src="<!--{$volist.uploadfiles}-->" alt="<!--{$volist.adsname}-->" />
           <h3><!--{$volist.adsname}--></h3>
       </a>
       <span><!--{$volist.content}--></span>
   </li>
   <!--{/foreach}-->   
</ul>

碎片

<ul class="c1_list11 clearfix">
   <!--{foreach $app->sp->find('company') as $volist}-->
   <li>
       <a href="<!--{$volist.url}-->" title="<!--{$volist.name}-->" class="img">
          <img src="<!--{$volist.img}-->" alt="<!--{$volist.name}-->" />
          <h3> <!--{$volist.name|truncate:20}--></h3>
      </a>
   </li>
   <!--{/foreach}-->
</ul>

产品，新闻，案例

<ul class="news_list11">
   <!--{foreach $app->content->lists('news', 1, 3, 0) as $volist}-->
   <li>
       <a href="<!--{$volist.url}-->" title="<!--{$volist.title}-->">
        <img src="<!--{$volist.thumbfiles}-->" alt="<!--{$volist.title}-->" />
           <!--{$volist.title|truncate:25:'...'}-->
       </a><span><!--{$volist.timeline|date_format:"%Y-%m-%d"}--></span>
   </li>
   <!--{/foreach}-->
</ul>

分类栏目(产品、新闻、案例)

<ul class="sort1">
    <!--{foreach $app->category->lists('product', 1) as $volist}-->
    <li><a href="<!--{$volist.url}-->"><!--{$volist.cname}--></a></li>
    <!--{/foreach}-->
 </ul>

9.6.4产品分类一二级

<ul class="sort1">
    <!--{foreach $app->category->lists('product') as $volist}-->
    <li>
         <a href="<!--{$volist.url}-->"><!--{$volist.cname}--></a>
         <ul class="sort1_2">
            <!--{foreach $volist.childcategory as $seclist}-->
            <li><a href="<!--{$seclist.url}-->"><!--{$seclist.cname}--></a></li>
            <!--{/foreach}-->
         </ul>
    </li>
    <!--{/foreach}-->
</ul>

友情链接

<!--{foreach $app->links->lists(1) as $volist}-->
  <a href='<!--{$volist.linkurl}-->' target='_blank'><!--{$volist.linktitle}--></a>
<!--{/foreach}-->

9.6.5 版本产品

<ul class="c11_list clearfix">
    <!--{foreach $app->content->lists('product', 1, 6, 0) as $volist}-->
    <li>
       <a href="<!--{$volist.url}-->" title="<!--{$volist.title}-->" class="img">
           <img src="<!--{$volist.thumbfiles}-->" alt="<!--{$volist.title}-->" />
           <h3><!--{$volist.title|truncate:20}--></h3>
       </a>
    </li>
    <!--{/foreach}-->
</ul>

9.4.14 新闻调取

<!-- $infos->show(1,5,0,0) 参数1为分类cid，参数2为显示数量，参数3为推荐，参数4为排序,1为正序 -->
<!--{foreach $infos->show(1,5,0,0) as $volist}-->
 <li>
     <a href="<!--{$volist.url}-->" title="<!--{$volist.title}-->">
         <img src="<!--{$volist.thumbfiles}-->" alt="<!--{$volist.title}-->" />
         <!--{$volist.title|truncate:25:'...'}-->
     </a><span><!--{$volist.timeline|date_format:"%Y-%m-%d"}--></span>
 </li>
<!--{/foreach}-->

9.4.14 产品调取

<!-- $products->show(1,5,0,0) 参数1为分类cid，参数2为显示数量，参数3为推荐，参数4为排序,1为正序 -->
<!--{foreach $products->show(1,5,0,0) as $volist}-->
<li>
    <a href="<!--{$volist.url}-->" title="<!--{$volist.title}-->">
       <img src="<!--{$volist.thumbfiles}-->" alt="<!--{$volist.title}-->" />
       <h3><!--{$volist.title|truncate:20}--></h3>
    </a>
</li>
<!--{/foreach}-->

9.4.14 案例调取

<!-- $cases->show(1,5,0,0) 参数1为分类cid，参数2为显示数量，参数3为推荐，参数4为排序,1为正序 -->
<!--{foreach $cases->show(1,5,0,0) as $volist}-->
<li>
    <a href="<!--{$volist.url}-->" title="<!--{$volist.title}-->">
         <img src="<!--{$volist.thumbfiles}-->" alt="<!--{$volist.title}-->" />
         <!--{$volist.title|truncate:25:'...'}-->
    </a><span><!--{$volist.timeline|date_format:"%Y-%m-%d"}--></span>
</li>
<!--{/foreach}-->

常用整合代码

// 默认第一个加类名
<script type="text/javascript">
  $(".sort1 li:eq(0)").addClass("change");
  $(".sort1 li").mouseover(function(){
     if(!$(this).hasClass("change")){
        $(this).siblings().removeClass("change").end().toggleClass("change");
      }
    }
  );
</script>

// 限制一行
<style type="text/css">
h1{
   overflow:hidden;
   text-overflow:ellipsis;
   white-space:nowrap
}
</style>

// 留言兼容性最终版
<style type="text/css">
.demo-message-wrap input::-webkit-input-placeholder,.demo-message-wrap textarea::-webkit-input-placeholder{color:#fff}
.demo-message-wrap input:-moz-placeholder,textarea:-moz-placeholder{color:#fff}
.demo-message-wrap input::-moz-placeholder,textarea::-moz-placeholder{color:#fff}
.demo-message-wrap input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#fff}
.demo-message-wrap input[type=text]::-webkit-input-placeholder{color:#fff}
</style>

// 无缝滚动
<div>
<!-- 常规滚动切换 -->
<img class="l_btn" src="<!--{$skinpath}-->images/pp_left.png" />
<img class="r_btn" src="<!--{$skinpath}-->images/pp_right.png" />

<!-- 滚动开始 -->
<div id="demo">
   <div id="indemo">
       <div id="demo1">
           <ul class="ab_gun_list clearfix">
               <!--{foreach $app->ads->find(11) as $volist}-->
               <li>
                <a href="<!--{$volist.url}-->" title="<!--{$volist.adsname}-->">
                     <img src="<!--{$volist.uploadfiles}-->" alt="<!--{$volist.adsname}-->" />
                </a>
               </li>
               <!--{/foreach}-->
           </ul>
       </div>
       <div id="demo2"></div>
   </div>
</div>
<!-- 滚动结束 -->
</div>

<style type="text/css">
    .l_btn,.r_btn{position:absolute;top:40%;cursor:pointer}
    .l_btn{left:0}
    .r_btn{right:0}
</style>

<script type="text/javascript">
    //滚动
    function scroll() {
        //产品滚动
        var speed = 30; //数字越大速度越慢
        var tab = document.getElementById("demo");
        var tab1 = document.getElementById("demo1");
        var tab2 = document.getElementById("demo2");
        var liwidth = tab1.getElementsByTagName("li");
        var liwidths = liwidth[0].offsetWidth;
        var length = $("#demo1 li").length;
        var mleft = parseInt($("#demo1 li:eq(0)").css("marginLeft"));
        var mright = parseInt($("#demo1 li:eq(0)").css("marginRight"));
        var totalwidth = (liwidths + mleft + mright) * length * 2 + 300;
        $("#indemo").width(totalwidth);
        tab2.innerHTML = tab1.innerHTML;
        var derection = 1;
        $(".l_btn").click(function() {
            derection = 0;
        });
        $(".r_btn").click(function() {
            derection = 1;
        });
        function Marquee() {
            if (derection) {
                if (tab2.offsetWidth - tab.scrollLeft <= 0)
                    tab.scrollLeft -= tab1.offsetWidth;
                else {
                    tab.scrollLeft++;
                }
            } else {
                if (tab.scrollLeft <= 0)
                    tab.scrollLeft += tab1.offsetWidth;
                else {
                    tab.scrollLeft--;
                }
            }
        }
        var MyMar = setInterval(Marquee, speed);
        tab.onmouseover = function() {
            clearInterval(MyMar);
        };
        tab.onmouseout = function() {
            MyMar = setInterval(Marquee, speed);
        };
    }
</script>

// 字体包
@font-face {
    font-family: 'constan';
    src:url('../fonts/constan.ttf') format('truetype');
}

// tab 切换特效
<style type="text/css">
    /* css */
    .tab-con { position: relative; }
    .tab-con .tab-main { position: absolute; left: 0; top: 0; z-index: 9; right: 0;}
    .tab-con .tab-main { opacity: 0; visibility: hidden; transition: all .5s ease; }
    .tab-con .tab-main.active { position: static; opacity: 1; visibility: visible;  }
</style>

<script>
    /* js */
    $(".tab-li li").eq(0).addClass('active');
    $(".tab-con .tab-main").eq(0).addClass('active');
    $(".tab-li li").hover(function(){
        var _id = $(this).index();
        $(this).addClass('active').siblings().removeClass('active');
        $(".tab-con .tab-main").eq(_id).addClass('active').siblings().removeClass('active');
    });
</script>

// 单页面判断
<!--{if $page.id ==1}-->  概况名称id
<!--{if $page.cid ==1}-->  概况分类id

// 链接加类名
<script>
    $(".footer a[href='"+window.location.href+"']").parents("li").addClass('active')
</script>

// 导航高亮
<script>
    $(".nav li a").each(function() {
            $this = $(this);
            if ($this[0].href == String(window.location)) {
            $this.parent().addClass("active");
        }
    });
</script>

 // php时间精确到时分秒
<script>
   <!--{$volist.timeline|date_format:"%Y-%m-%d %H:%M:%S"}-->
</script>

// 非自适应网站  手机站要和电脑站展示完全一样
<meta name="viewport" content="width=1200,target-densitydpi=device-dpi,user-scalable=no">

// hover 显示隐藏事件
<script>
    $(".iconn").hover(function() {
        $(this).find(".tel_tanchu").toggle(200);
    })
</script>

// 限制截取
<!--{if $volist@index lt 4}-->
<!--{/if}-->

// 限制字符
<!--{$volist.summary|truncate:70:'...':true}-->    

// 调取数字
<b>0<!--{$volist@iteration}--></b>

// 导航固定头部
<script>
    //导航条固定在头部
    if ($(window).scrollTop() > 30) {
        $('.xy-head').addClass('scroll');
    }
    $(window).scroll(function() {
        var len = $(this).scrollTop();
        if (len > 30) {
            $('.xy-head').addClass('scroll');
        } else {
            $('.xy-head').removeClass('scroll')
        }
    });
</script>

// slick 双排切换
<div class="c3-slick">
    <!--{foreach $app->ads->find(11) as $volist}-->
    <div class="slick-con">
        <img src="<!--{$volist.uploadfiles}-->" alt="<!--{$volist.adsname}-->" />
    </div>
    <!--{/foreach}-->
</div>

<script>
    /* 使用js分组，每2个.slick-con放到一个div里面 */
    jQuery(".c3-slick .slick-con").each(function(i){ jQuery(".c3-slick .slick-con").slice(i*2,i*2+2).wrapAll("<div></div>");});  

    $(".c3-slick").slick({
        arrows:true,
        dots: false,
        speed: 300,
        slidesToShow: 5,
        slidesToScroll: 1,
        autoplay:true,
        responsive: [
            {
                breakpoint: 990,
                settings: {
                    slidesToShow: 4,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 768,
                settings: {
                    slidesToShow: 3,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 480,
                settings: {
                    slidesToShow: 2,
                    slidesToScroll: 1
                }
            }
        ]
    })
</script>