zoukankan      html  css  js  c++  java
  • Layui 内置方法

    相册层,也可以称之为图片查看器。它的出场动画从layer内置的动画类型中随机展现。photos支持传入json和直接读取页面图片两种方式。如果是json传入,如下:

    1 $.getJSON('/jquery/layer/test/photos.json', function(json){
    2   layer.photos({
    3     photos: json
    4     ,anim: 5 //0-6的选择,指定弹出图片动画类型,默认随机(请注意,3.0之前的版本用shift参数)
    5   });
    6 }); 

    返回的json需严格按照如下格式:

     1 {
     2   "title": "", //相册标题
     3   "id": 123, //相册id
     4   "start": 0, //初始显示的图片序号,默认0
     5   "data": [   //相册包含的图片,数组格式
     6     {
     7       "alt": "图片名",
     8       "pid": 666, //图片id
     9       "src": "", //原图地址
    10       "thumb": "" //缩略图地址
    11     }
    12   ]
    13 }

    如果是直接从页面中获取图片,那么需要指向图片的父容器,并且你的img可以设定一些规定的属性(但不是必须的)。

     1 //HTML示例
     2 <div id="layer-photos-demo" class="layer-photos-demo">
     3   <img layer-pid="图片id,可以不写" layer-src="大图地址" src="缩略图" alt="图片名">
     4   <img layer-pid="图片id,可以不写" layer-src="大图地址" src="缩略图" alt="图片名">
     5 </div>
     6  
     7 <script>
     8 //调用示例
     9 layer.photos({
    10   photos: '#layer-photos-demo'
    11   ,anim: 5 //0-6的选择,指定弹出图片动画类型,默认随机(请注意,3.0之前的版本用shift参数)
    12 }); 
    13 </script>


    版权声明:本文为CSDN博主「杨林伟」的原创文章
    原文链接:https://blog.csdn.net/qq_20042935/article/details/89448595

     

  • 相关阅读:
    Attributes in C#
    asp.net C# 时间格式大全
    UVA 10518 How Many Calls?
    UVA 10303 How Many Trees?
    UVA 991 Safe Salutations
    UVA 10862 Connect the Cable Wires
    UVA 10417 Gift Exchanging
    UVA 10229 Modular Fibonacci
    UVA 10079 Pizza Cutting
    UVA 10334 Ray Through Glasses
  • 原文地址:https://www.cnblogs.com/moppet/p/12467867.html
Copyright © 2011-2022 走看看