/*reset css*/ * { margin:0; pn:0; padding:0; list-style:none; border:0; } /*demo css*/ .i_box { position:relative; overflow:hidden; width:100%; height:350px; margin:0px auto 0 auto; } .i_imglist { width:100%; height:350px; z-index:0 } .i_imglist li img { width:100%; height:350px; display:block } .i_nav { position:absolute; right:116px; bottom:0; overflow:hidden; width:220px; height:300px; z-index:2; } .i_nav ul li { float:left; background-color:#fff; background-color:rgba(255,255,255,.9); width:220px; height:35px; margin:0 1px; opacity:0.9; filter:alpha(opacity=50); text-align:center; line-height:30px; cursor:pointer; } .i_nav ul li.hover { background-color:#ff6428; opacity:0.8; filter:alpha(opacity=80) } .i_nav ul li a { color:#000; text-decoration:none } .i_nav ul li.hover a { color:#fff } .i_prev a,.i_next a { position:absolute; overflow:hidden; width:19px; height:30px; background-color:#000; color:#fff; text-align:center; font-weight:bold; opacity:0.9; filter:alpha(opacity=90); text-decoration:none; line-height:30px } .i_prev a { left:0; bottom:0 } .i_next a { right:0; bottom:0 } .i_prev a:hover,.i_next a:hover { background-color:#fff; opacity:0.8; filter:alpha(opacity=80); color:#000 }
鼠标经过切换轮播图,不用点击,高端首页视频轮播插件
需要几张图片就加多少个代码
<li><a href="/"><img src="http://www.jq22.com/img/cs/500x300-1.png" alt="" title="" /></a></li> <li><a href="/">往事</a></li>
简单不?