代码使用指南 |
![]() |
<style type="text/css"> .bbf_slide_lr_1 { margin-bottom: 10px; padding: 5px 35px; position: relative; border: 1px solid #ccc; border-right: none; border-radius: 5px; } .bbf_slide_lr_1 li { float: left; overflow: hidden; padding: 0 3px; text-align: center; } .bbf_slide_lr_1 li a { display: block; } .bbf_slide_lr_1 .slidebarbtn { display: block; font-family: Geneva,sans-serif; font-size: 36px; height: 80px; line-height: 80px; position: absolute; text-align: center; width: 28px; background: none repeat scroll 0 0 #f2f2f2; border: 1px solid #cdcdcd; color: #333; border-radius: 5px; } .bbf_slide_lr_1 .slidebarbtn:hover { text-decoration: none; } .bbf_slide_lr_1 .slidebarbtn:hover { background: none repeat scroll 0 0 #fcc9a4; border: 1px solid #cdcdcd; color: #fff; } .bbf_slide_lr_1 .slidebarup { left: 5px; top: 66px; } .bbf_slide_lr_1 .slidebardown { right: 5px; top: 66px; } .bbf_slide_lr_1 em { position: absolute; left: 3px; bottom: 0; height: 40px; text-indent: 5px; line-height: 40px; font-size: 16px; color: #000; overflow: hidden; background-color: #fff; opacity: .4;filter:alpha(opacity=40); } .bbf_slide_lr_1 a:hover em { background-color: #000; } .bbf_slide_lr_1 li:hover em { color: #fff; text-decoration: none; } </style> <div class="slidebox bbf_slide_lr_1" slidenum="4" slidestep="3" > <!--4个,每次滚动3个--> <a class="slidebarbtn leftbtn slidebarup" mevent="click" href="javascript:void(0);"> <</a> <div class="middle cl" > <ul class="slideshow"> [loop] <li style="width: {picwidth}px;"> <a href="{url}" {target} title="{title}"><img src="{pic}" width="{picwidth}px" height="{picheight}px" alt="{title}" /><em>{title}</em> </a> </li> [/loop] [index=1] <li style="width: {picwidth}px;"> <style type="text/css"> .slidebarup,.slidebardown {top:top:calc({picheight}px/2 - 35px);top:-moz-calc({picheight}px/2 - 35px);top:-webkit-calc({picheight}px/2 - 35px);} .bbf_slide_lr_1 em {width:{picwidth}px;} </style> <a href="{url}" {target} title="{title}"><img src="{pic}" width="{picwidth}px" height="{picheight}px" alt="{title}" /><em>{title}</em></a> </li> [/index] </ul> </div> <a class="slidebarbtn rightbtn slidebardown" mevent="click" href="javascript:void(0);">> </a> </div> <script type="text/javascript"> runslideshow(); </script> |
上一篇:滚动图片 | 下一篇:如何设置dz中的搜索默认为搜索文章 |
CopyRight 2012-2017 合元网络 版权所有
公司地址:郑州市高新区升龙又一城A区2号楼2单元17楼 热线电话:15303843903 技术QQ:1808040020 微 信:15303843903 豫ICP备14027215号 |