home.html
2.96 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
{template 'header'}
<style>
body{
font:{$_W['styles']['fontsize']} {$_W['styles']['fontfamily']};
color:{$_W['styles']['fontcolor']};
padding:0;
margin:0;
background-image:url('{if empty($_W['styles']['indexbgimg'])}./themes/style15/images/bg_index.jpg{else}{$_W['styles']['indexbgimg']}{/if}');background-size:cover;
background-color:{if empty($_W['styles']['indexbgcolor'])}#F9F9F9{else}{$_W['styles']['indexbgcolor']}{/if};
{$_W['styles']['indexbgextra']}
}
a{color:{$_W['styles']['linkcolor']}; text-decoration:none;}
{$_W['styles']['css']}
.box{overflow:hidden; width:100%;height:90px; position:absolute; bottom:0; background:rgba(0, 0, 0, 0.4); border-top:1px rgba(0, 0, 0, 0.1) solid;}
.box,.box ul{padding:0px; margin:0px; list-style:none;}
.box ul{width:1400px; height:100%; position:absolute; top:0px; left:0px;}
.box .slide-nav{height:90px; float:left; overflow:hidden; position:relative;}
.box .box-item{float:left;position:relative;text-align:center;display:block;text-decoration:none;outline:none;width:25%;height:90px;color:#FFF;padding:5px 0;}
.box .box-item i{display:inline-block;width:50px;height:50px;line-height:50px;font-size:35px;color:#000000; margin-bottom:5px; overflow:hidden; background:rgba(255, 255, 255, 0.8); border:1px #FFF solid;}
.box .box-item span{color:{$_W['styles']['fontnavcolor']};display:block; font-size:14px; width:90%; margin:0 5%; height:20px; line-height:20px; overflow:hidden;}
.box_swipe > ol{background-color:transparent; padding-right:0; text-align:center; margin-top:0; position:absolute; top:0; right:10px;}
</style>
<script>
require(['jquery'],function($){
$('i').addClass("img-circle");
});
</script>
<div class="box" id="box">
<ul>
{php $num = 0;}
{data func="site_navs" item="row"}
{if $num%4 == 0 && $num != 0}</li>{/if}
{if $num%4 == 0 || $num == 0}<li class="slide-nav">{/if}
{$row['html']}
{php $num++;}
{/data}
</ul>
</div>
{php $footer_off = 1;}
<script>
require(['jquery'],function(){
$(function(){
$(window).resize(function () {
var windowW=$(window).width();
var list=$(".slide-nav");
var box=$(".box ul");
if(windowW<320){
list.css("width",128);
box.css("width",list.length*128);
}else{
list.css("width",windowW);
box.css("width",list.length*windowW);
}
});
$(window).resize();
var num=0;
var box = $(".box ul");
function moves () {
num++;
if($(".slide-nav").length==1){
box.css("left",0);
}else if(num==$(".slide-nav").length){
box.animate({left:-num*$(".slide-nav").width()},500,function(){
box.css("left",0);
});
num=0;
}else {
box.animate({left:-num*$(".slide-nav").width()},500);
}
}
var t= setInterval(moves,2000);
});
});
</script>
{template 'footer'}
<script>
require(['jquery'],function(){
$(function(){
if($('.quick')!=null && $('.quick')!=''){
var h = $('.quick').height()+'px';
$('.box').css("bottom",h);
}else{
$('.box').css("bottom",0);
}
})
});
</script>