1、以下是CSS文件代码:问题描述: 用的是伊人集模板,首页轮播图是自动把多张图合成一张的,现请编程大神帮忙看一下代码,改成常规的单张图轮播,谢谢!
.DB_tab25 {width:100%;height:320px;position:relative;overflow:hidden;cursor:pointer;z-index:0;} .DB_tab25 .DB_bgSet{position:relative;} .DB_tab25 .DB_bgSet li{position:absolute;width:100%;height:320px;display:none;} .DB_tab25 .DB_imgSet{position:absolute;width:1000px;left:50%;margin-left:-500px;} .DB_tab25 .DB_imgSet .DB_1_1{position:absolute;left:20px;top:120px;} .DB_tab25 .DB_imgSet .DB_1_2{position:absolute;left:20px;top:60px} .DB_tab25 .DB_imgSet .DB_1_3{position:absolute;left:300px;top:0px} .DB_tab25 .DB_imgSet .DB_2_1{position:absolute;left:20px;top:60px;} .DB_tab25 .DB_imgSet .DB_2_2{position:absolute;left:20px;top:160px} .DB_tab25 .DB_imgSet .DB_2_3{position:absolute;left:540px;top:0px} .DB_tab25 .DB_imgSet .DB_3_1{position:absolute;left:520px;top:120px;} .DB_tab25 .DB_imgSet .DB_3_2{position:absolute;left:520px;top:200px} .DB_tab25 .DB_imgSet .DB_3_3{position:absolute;left:-100px;top:0px} .DB_tab25 .DB_imgSet .DB_4_1{position:absolute;left:120px;top:0px;} .DB_tab25 .DB_imgSet .DB_4_2{position:absolute;left:540px;top:40px} .DB_tab25 .DB_imgSet .DB_4_3{position:absolute;left:690px;top:70px} .DB_tab25 .DB_imgSet .DB_4_4{position:absolute;left:640px;top:160px} .DB_tab25 .DB_imgSet .DB_4_5{position:absolute;left:770px;top:0px} .DB_tab25 .DB_menuWrap{position:absolute;width:1000px;left:50%;margin-left:-500px;} .DB_tab25 .DB_menuWrap .DB_menuSet{position:absolute;width:100%;top:240px;text-align:center;font-size:0; border-radius:20px;} .DB_tab25 .DB_menuWrap .DB_menuSet li{cursor:pointer;margin:0 3px;display:inline} .DB_tab25 .DB_prev{position:absolute;left:-100px;top:120px;cursor:pointer;display:none} .DB_tab25 .DB_next{position:absolute;right:-100px;top:120px;cursor:pointer;display:none}2.以下是htm文件代码:
<link rel="stylesheet" href="<?php echo G_STATIC_URL; ?>/css/fox/lunbo.css" /> <script type="text/javascript" src="<?php echo G_STATIC_URL; ?>/css/fox/jquery.DB_tabMotionBanner.min.js"></script> <div class="DB_tab25 hidden-xs"> <ul class="DB_bgSet"> <li style="background:url(<?php echo base_url();?>/ad/lunbo/bj1.jpg) no-repeat 100% 100%;"></li> <li style="background:url(<?php echo base_url();?>/ad/lunbo/bj2.jpg) no-repeat 100% 100%;"></li> <li style="background:url(<?php echo base_url();?>/ad/lunbo/bj3.jpg) no-repeat 100% 100%;"></li> <li style="background:url(<?php echo base_url();?>/ad/lunbo/bj4.jpg) no-repeat 100% 100%;"></li> </ul> <ul class="DB_imgSet"> <li onClick="javascript:window.location.href='/';"> <img class="DB_1_1" src="<?php echo base_url();?>/ad/lunbo/kjzname.png" alt=""> <img class="DB_1_2" src="<?php echo base_url();?>/ad/lunbo/kjzjx.png" alt=""> <img class="DB_1_3" src="<?php echo base_url();?>/ad/lunbo/bn_01.png" alt=""> </li> <li onClick="javascript:window.location.href='/';"> <img class="DB_2_1" src="<?php echo base_url();?>/ad/lunbo/addchelun.png" alt=""> <img class="DB_2_2" src="<?php echo base_url();?>/ad/lunbo/addt.png" alt=""> <img class="DB_2_3" src="<?php echo base_url();?>/ad/lunbo/zw.png" alt=""> </li> <li onClick="javascript:window.location.href='/';"> <img class="DB_3_1" src="<?php echo base_url();?>/ad/lunbo/bn32.png" alt=""> <img class="DB_3_2" src="<?php echo base_url();?>/ad/lunbo/bn33.png" alt=""> <img class="DB_3_3" src="<?php echo base_url();?>/ad/lunbo/bn3.png" alt=""> </li> <li onClick="javascript:window.location.href='/';"> <img class="DB_4_1" src="<?php echo base_url();?>/ad/lunbo/bn_04.png" alt=""> <img class="DB_4_2" src="<?php echo base_url();?>/ad/lunbo/bn_042.png" alt=""> <img class="DB_4_3" src="<?php echo base_url();?>/ad/lunbo/bn_043.png" alt=""> <img class="DB_4_4" src="<?php echo base_url();?>/ad/lunbo/bn_044.png" alt=""> </li> </ul> <div class="DB_menuWrap"> <ul class="DB_menuSet"> <li><img src="<?php echo base_url();?>/ad/lunbo/btn_off.png" alt=""></li> <li><img src="<?php echo base_url();?>/ad/lunbo/btn_off.png" alt=""></li> <li><img src="<?php echo base_url();?>/ad/lunbo/btn_off.png" alt=""></li> <li><img src="<?php echo base_url();?>/ad/lunbo/btn_off.png" alt=""></li> </ul> <div class="DB_next"><img src="<?php echo base_url();?>/ad/lunbo/nextArrow.png" alt="NEXT"></div> <div class="DB_prev"><img src="<?php echo base_url();?>/ad/lunbo/prevArrow.png" alt="PREV"></div> </div> </div> <div id="foxshas"> <div class="i_content"></div> </div> <script type="text/javascript"> $('.DB_tab25').DB_tabMotionBanner({ key:'b28551', autoRollingTime:8000, bgSpeed:300, motion:{ DB_1_1:{left:-50,opacity:0,speed:1000,delay:500}, DB_1_2:{left:-50,opacity:0,speed:1000,delay:1000}, DB_1_3:{left:100,opacity:0,speed:1000,delay:1500}, DB_2_1:{top:10,opacity:0,speed:1000,delay:500}, DB_2_2:{top:20,opacity:0,speed:1000,delay:1000}, DB_2_3:{top:40,opacity:0,speed:1000,delay:1500}, DB_3_1:{left:-50,opacity:0,speed:1000,delay:500}, DB_3_2:{top:40,opacity:0,speed:1000,delay:1000}, DB_3_3:{top:0,opacity:0,speed:1000,delay:1500}, DB_4_1:{top:40,opacity:0,speed:1000,delay:500}, DB_4_2:{top:0,opacity:0,speed:1000,delay:1000}, DB_4_3:{top:0,opacity:0,speed:1000,delay:1500}, DB_4_4:{top:20,opacity:0,speed:1000,delay:2000}, DB_4_5:{top:80,opacity:0,speed:1000,delay:3000}, end:null } }) </script>3、图片文件夹截图 4、轮播显示页截图