我的时不我予 我的时不我予
关注数: 1 粉丝数: 59 发帖数: 540 关注贴吧数: 7
图片轮播 点击下一个,样式就变了,只有ie变化 版本11,别的行 /*轮换图*/ #banner { position: relative; width: 90%; height: 90%; border:solid #666; overflow: hidden;border: 0%; } #banner_bg { position: absolute; bottom: 0; background-color: #000; height:0%; filter: Alpha(Opacity=30); opacity: 0.3; z-index: 1000; cursor: pointer; width: 100%;border: 0%; } #banner ul { position: absolute; list-style-type: none; filter: Alpha(Opacity=80); opacity: 0.8; z-index: 1002; margin: 0; padding: 0; bottom: 0px; right: 5px; border: 0%; } #banner ul li { padding: 0% 10%; float: left; display: block; color: #FFF; background: #6f4f67; cursor: pointer; border: solid #333; } #banner ul li.on { background-color: #000; } #banner_list a { position: absolute; } var t = n = 0, count; $(document) .ready( function() { count = $("#banner_list a").length; $("#banner_list a:not(:first-child)").hide(); $("#banner_info").html( $("#banner_list a:first-child").find("img") .attr('alt')); $("#banner_info").click( function() { window.open($("#banner_list a:first-child") .attr('href'), "_blank") }); $("#banner li") .click( function() { var i = $(this).text() - 1;//获取Li元素内的值,即1,2,3,4 n = i; if (i >= count) return; $("#banner_info").html( $("#banner_list a").eq(i) .find("img").attr( 'alt')); $("#banner_info") .unbind() .click( function() { window .open( $( "#banner_list a") .eq( i) .attr( 'href'), "_blank") }) $("#banner_list a").filter( ":visible").fadeOut(500) .parent().children().eq(i) .fadeIn(1000); document.getElementById("banner").style.background = ""; $(this).toggleClass("on"); $(this).siblings().removeAttr( "class"); }); t = setInterval("showAuto()", 4000); $("#banner").hover(function() { clearInterval(t) }, function() { t = setInterval("showAuto()", 4000); }); }) function showAuto() { n = n >= (count - 1) ? 0 : ++n; $("#banner li").eq(n).trigger('click'); }
1 下一页