root
/
Pear-Admin-Layui
mirror of https://gitee.com/zhang_1334717033/Pear-Admin-Layui
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

轮播图

develop
Jmysy 2020-06-10 08:39:53 +08:00
parent dfc718618c
commit d666546327
2 changed files with 30 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
Pear Admin v 2.0/admin/images/designModel.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 126 KiB

54
Pear Admin v 2.0/view/console/console2.html
View File

@ -51,13 +51,13 @@
<span class="pear-card-title">表单</span> <span class="pear-card-title">表单</span>
</div> </div>
<div class="layui-col-md3 layui-col-sm3 layui-col-xs3"> <div class="layui-col-md3 layui-col-sm3 layui-col-xs3">
<div class="pear-card" data-id="home5" data-title="安全" data-url="http://www.baidu.com"> <div class="pear-card" data-id="home5" data-title="安全" data-url="http://www.baidu.com">
<i class="layui-icon layui-icon-auz"></i> <i class="layui-icon layui-icon-auz"></i>
</div> </div>
<span class="pear-card-title">安全</span> <span class="pear-card-title">安全</span>
</div> </div>
<div class="layui-col-md3 layui-col-sm3 layui-col-xs3"> <div class="layui-col-md3 layui-col-sm3 layui-col-xs3">
<div class="pear-card" data-id="home6" data-title="公告" data-url="http://www.baidu.com"> <div class="pear-card" data-id="home6" data-title="公告" data-url="http://www.baidu.com">
<i class="layui-icon layui-icon-cart"></i> <i class="layui-icon layui-icon-cart"></i>
</div> </div>
<span class="pear-card-title">公告</span> <span class="pear-card-title">公告</span>
@ -113,13 +113,14 @@
每日推荐 每日推荐
</div> </div>
<div class="layui-card-body person" style="height: 195px;"> <div class="layui-card-body person" style="height: 195px;">
<div class="layui-carousel" id="test1"> <div class="layui-carousel" id="test1">
<div carousel-item> <div carousel-item>
<div><a target="_blank" href="https://blog.yuqiyu.com"><img src="../../admin/images/springboot.png" style="width: 100%;height: 100%;margin: 0px;"></a></div> <div><a target="_blank" href="http://c.biancheng.net/design_pattern/"><img src="../../admin/images/designModel.png" style="width: 100%;height: 100%;margin: 0px;"></a></div>
</div> <div><a target="_blank" href="https://blog.yuqiyu.com"><img src="../../admin/images/springboot.png" style="width: 100%;height: 100%;margin: 0px;"></a></div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
@ -176,28 +177,33 @@
<!--</div>--> <!--</div>-->
<script src="../../component/layui/layui.js" charset="utf-8"></script> <script src="../../component/layui/layui.js" charset="utf-8"></script>
<script> <script>
layui.use(['layer', 'echarts','carousel', 'element','pearTab'], function() { layui.use(['layer', 'echarts', 'carousel', 'element', 'pearTab'], function() {
var $ = layui.jquery, var $ = layui.jquery,
layer = layui.layer, layer = layui.layer,
element = layui.element, element = layui.element,
pearTab = layui.pearTab, pearTab = layui.pearTab,
echarts = layui.echarts, echarts = layui.echarts,
carousel = layui.carousel, carousel = layui.carousel,
carousel = layui.carousel; carousel = layui.carousel;
carousel.render({
elem: '#test1' carousel.render({
,width: '100% ' elem: '#test1',
,height: '100%' width: '100% ',
,interval: 5000 //每2秒，自动轮播 height: '100%',
,arrow: 'always' interval: 5000 //每2秒，自动轮播
,
arrow: 'always'
}); });
var echartsRecords = echarts.init(document.getElementById('echarts-records'), 'walden'); var echartsRecords = echarts.init(document.getElementById('echarts-records'), 'walden');
$("body").on("click","[data-url]",function(){ $("body").on("click", "[data-url]", function() {
parent.layui.pearTab.addTabOnlyByElem("content" parent.layui.pearTab.addTabOnlyByElem("content", {
,{id:$(this).attr("data-id"),title:$(this).attr("data-title"),url:$(this).attr("data-url"),close:true}) id: $(this).attr("data-id"),
title: $(this).attr("data-title"),
url: $(this).attr("data-url"),
close: true
})
}) })
@ -431,11 +437,11 @@ carousel.render({
}; };
echartsRecords.setOption(option); echartsRecords.setOption(option);
window.onresize = function() { window.onresize = function() {
echartsRecords.resize(); echartsRecords.resize();
} }
}); });
</script> </script>
</body> </body>