jquery背景渐变切换banner

小鱼儿 2022-05-21 01:55 174阅读 0赞

<script type="text/javascript">
    $(document).ready(function(){
    	var $tab_li = $('#tab ul li');
    	$tab_li.hover(function(){
    		$(this).addClass('selected').siblings().removeClass('selected');
    		var index = $tab_li.index(this);
    		$('div.tab_box > div').eq(index).show().siblings().hide();
    	});	
    });
    </script><script type="text/javascript">
    $(function(){
    	$(".screenbg ul li").each(function(){
    		$(this).css("opacity","0");
    	});
    	$(".screenbg ul li:first").css("opacity","1");
    	var index = 0;
    	var t;
    	var li = $(".screenbg ul li");	
    	var number = li.size();
    	function change(index){
    		li.css("visibility","visible");
    		li.eq(index).siblings().animate({opacity:0},3000);
    		li.eq(index).animate({opacity:1},3000);
    	}
    	function show(){
    		index = index + 1;
    		if(index<=number-1){
    			change(index);
    		}else{
    			index = 0;
    			change(index);
    		}
    	}
    	t = setInterval(show,8000);
    	//根据窗口宽度生成图片宽度
    	var width = $(window).width();
    	$(".screenbg ul img").css("width",width+"px");
    });
    </script>
    <div class="screenbg">
      <ul>
        <li><a href="javascript:;"><img src="images/0.jpg"></a></li>
        <li><a href="javascript:;"><img src="images/1.jpg"></a></li>
        <li><a href="javascript:;"><img src="images/2.jpg"></a></li>
      </ul>
    </div>

发表评论取消回复

表情：

评论列表（有 0 条评论，174人围观）

还没有评论，来说两句吧...

相关阅读

相关 css背景渐变(灰色渐变背景)

css中文字的渐变怎么？css中文字的渐变怎么办洪资实业样式如下： .text-gradient \{ display: inline-block; colo

Dear 丶/ 2023年09月26日 13:13/ 0 赞/ 183 阅读

相关 css 设置背景渐变

渣渣辰又来了，这次也不例外，同样是带着问题过来的，真的是人生处处是bug，这不。又来了。。。。。。写了这么久的样式我竟然不知道如何设置背景渐变，我的存在真的可能是个意外，都

系统管理员/ 2023年07月25日 06:14/ 0 赞/ 34 阅读

相关 css3背景渐变

从上到下的线性渐变： background: linear-gradient(red, blue); /\ 标准的语法 \/ 线性渐变 - 从左到右 backgrou

╰+攻爆jí腚メ/ 2023年06月19日 04:26/ 0 赞/ 40 阅读

相关网页背景渐变

<!DOCTYPE html> <html> <head> <title>网页背景渐变</title> <meta http-equi

川长思鸟来/ 2022年08月12日 21:00/ 0 赞/ 230 阅读

相关 JavaFX设置背景颜色渐变

有时候我们需要设置控件背景颜色渐变。设置按钮的背景颜色由\00fffc渐变为\fff600，css如下： upButton{ -fx-backgr

逃离我推掉我的手/ 2022年06月09日 02:14/ 0 赞/ 950 阅读

相关 jquery背景渐变切换banner

<script type="text/javascript"> $(document).ready(function(){ var $tab_li =

小鱼儿/ 2022年05月21日 01:55/ 0 赞/ 175 阅读

相关 vue背景渐变切换动画

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

短命女/ 2022年05月21日 01:55/ 0 赞/ 342 阅读

相关 css设置背景色渐变

css完成以下如图背景色 ![在这里插入图片描述][2019011414465155.png]css样式 div1 { width: 100%;

墨蓝/ 2022年04月22日 16:06/ 0 赞/ 375 阅读

相关 CSS3背景，渐变

1，有利于代码维护，有利于使用debug进行调试打断点。 2，后面三个都存在计算，所以分开写最好。背景复合属性最好的写法， background:\abcdef

﹏ヽ暗。殇╰゛Y/ 2021年12月20日 01:04/ 0 赞/ 456 阅读

相关 CSS 背景颜色渐变

<style type="text/css"> html,body \{ margin:0px; width

水深无声/ 2021年11月29日 09:32/ 0 赞/ 525 阅读