• 移动端-左右滑动


     1 <div id="picBox" style="overflow: hidden;">
     2    <ul class="hotPic" style="display:flex;padding-bottom:15px;">
     3        {loop $news_category $item}
     4        <li class="hotImg " style="position: relative;">
     5            <a href="#" style="103px;">
     6                 <img class="hotImg1" src="./resource/attachment/{$item['thumb']}" alt="">
     7                 <div style="96%;height:103px;
     8                                 position: absolute;top:0;left:0;">
     9                      {if $item['isrecommand'] == 1}
    10                      <span style="display: block;40px;height:26px;line-height:26px;text-align: center;
    11                                     font-size:16px;color:#fff;background-color:rgb(255,102,102);margin-bottom:-26px;">
    12                                         活动
    13                      </span>
    14                      {/if}
    15                      <p style="color: #fff;font-weight:bold;text-align:center;margin-top:43px;margin-bottom:0;">
    16                                         #{$item['name']}#
    17                      </p>
    18                                 </div>
    19             </a>
    20         </li>
    21         {/loop}
    22      </ul>
    23 </div>  
     1 <script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
     2 <script src="http://cdn.bootcss.com/iScroll/5.2.0/iscroll.js"></script>
     3 
     4 <script>
     5 
     6         var ele = $(".hotPic");
     7         ele.width((ele.find(".hotImg").length + 1) * 112);   // 112-滑动距离?
     8         var myScroll = new IScroll('#picBox', {scrollX: true, scrollY: false});   //实例化
     9 
    10 </script>
  • 相关阅读:
    python 的时间复杂度
    python之进制转换
    进程、线程、协程
    [GO]gtk的windows环境搭建
    [GO]并的爬取捧腹的段子
    [GO]并发的网络爬虫
    [GO]百度贴吧的爬虫
    [operator]jenkins+gitlab/Webhook自动构建发布
    [GO]并发实现聊天室服务器
    [GO]文件的收发服务器
  • 原文地址:https://www.cnblogs.com/llying/p/9642764.html
Copyright © 2020-2023  润新知