当前路径: 星河码客 » 插件特效 » 带箭头的jquery度屏焦点图切换

带箭头的jquery度屏焦点图切换

适用方法引用jscss样式.slider { width:100%; min-width:980px; height:335px; position:relative; overflow:hidden; background:#fff; text-align:center;}.slider .bd { width:980px; position:absolute; left:50%; margin-left:-490px}.slider .bd li { width:980px; overflow:hidden;}.slider .bd li img { display:block; width:980px; height:335px;}.slider .tempWrap { overflow:visible !important}.slider .tempWrap ul { margin-left:-980px !important;}.slider .hd { position:absolute; width:100%; left:0; z-index:1; height:8px; bottom:20px; text-align:center;}.slider .hd li { display:inline-block; *display:inline; zoom:1; width:8px; height:8px; line-height:99px; overflow:hidden; background:url(images/slider-btn.png) 0 -10px no-repeat; margin:0 5px; cursor:pointer; filter:alpha(opacity=60); opacity:0.6;}.slider .hd li.on { background-position:0 0; filter:alpha(opacity=100); opacity:1;}.slider .pnBtn { position:absolute; z-index:1; top:0; width:100%; height:335px; cursor:pointer;}.slider .prev { left:-50%; margin-left:-490px;}.slider .next { left:50%; margin-left:490px;}.slider .pnBtn .blackBg { display:block; position:absolute; left:0; top:0; width:100%; height:335px; background:#000; filter:alpha(opacity=50); opacity:0.5;}.slider .pnBtn .arrow { display:none; position:absolute; top:0; z-index:1; width:60px; height:335px;}.slider .pnBtn .arrow:hover { filter:alpha(opacity=60); opacity:0.6;}.slider .prev .arrow { right:0; background:url(images/slider-arrow.png) -120px 0 no-repeat;}.slider .next .arrow { left:0; background:url(images/slider-arrow.png) 0 0 no-repeat;}html

js

带箭头的jquery度屏焦点图切换

在线演示        积分下载        6毛下载        砍两刀下载       

文件目录······
暂无数据
 猜你喜欢 更多»
 工具推荐 更多»