Layui之可调参数的动态轮播图---好玩的小玩意儿~

⭐ 本期精彩：利用Layui制作轮播图

效果图：

前台代码：

 JS代码：

 设置长宽高的事件代码：

//事件
  carousel.on('change(test1)', function(res){
    console.log(res)
  });
  var $ = layui.$, active = {
    set: function(othis){
      var THIS = 'layui-bg-normal'
      ,key = othis.data('key')
      ,options = {};
      othis.css('background-color', '#5FB878').siblings().removeAttr('style'); 
      options[key] = othis.data('value');
      ins3.reload(options);
    }
  };
  
 //监听开关
  form.on('switch(autoplay)', function(){
    ins3.reload({
      autoplay: this.checked
    });
  });
  //输入框的
 $('.demoSet').on('keyup', function(){
    var value = this.value
    ,options = {};
    if(!/^\d+$/.test(value)) return;
    
    options[this.name] = value;
    ins3.reload(options);
  }); 

});

完整代码：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
   <%@ include file="common/heard.jsp" %>








 

  

    

    

    

    

  
 
 

  
设定宽高
 

  

    

      宽高