jQuery文字列表切换代码



68 271 91



特效描述:jQuery 文字列表切换代码,jQuery文字列表切换代码

代码结构

1. 引入JS

<script type="text/javascript" src="js/jquery.js"></script>

2. HTML代码

<div class="expertbox">
	<div class="it_expert">
		<p class="it_expertp1">专家推荐</p>
		<p class="it_expertp2">
			<span id="it_awewe" class="it_awewe">
				<a href="#" class="it_expertspan1" id="previous2"> < </a>
				<a href="#" class="it_expertspan2" id="next2"> > </a>
			</span>
		</p>
	</div>
	<div class="it_expert3">
		<div id="hot_ranks2">  
			<ul class="current" style="display: block;">  
				<li>
					<div class="it_expertxt">
						<p class="it_expertit">11111111[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企企业把招商的所有事情都可以外包给招商快车公司营好自身的核心业务,渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
					<div class="it_expertxt">
						<p class="it_expertit">2222221[2015-06-05]</p>
						<p class="it_experconter">招商外包企业把招商的所有事情都可以外包给招商快车公司,企业只需要集中力量经营好自身的核心业务,渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
					<div class="it_expertxt">
						<p class="it_expertit">3333333331[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业把招商的所有事企业把招商的所有事情都可以外包给招商快车公司渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
					<div class="it_expertxt">
						<p class="it_expertit">3333333331[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业把招商的所有事企业把招商的所有事情都可以外包给招商快车公司渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
				</li>  
			</ul>
			<ul class="current" style="display: none;">  
				<li>
					<div class="it_expertxt">
						<p class="it_expertit">5555555552[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业把招商的所有事情都可以外包给招企业把招商的所有事情都可以外包给招商快车公司企业把招商的所有事情都可以外包给招商快车公司道盈利模型、产品组合策略</p>
					</div>
					<div class="it_expertxt">
						<p class="it_expertit">66666666666[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业把招商的所有事情都可以外包给招商快车公司去做,企业只需要集中力量经营好自身的核心业务,渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
					<div class="it_expertxt">
						<p class="it_expertit">77777777777[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业把招商的所有事情都可以外包给招商快车公司去做,企业只需要集中力量经营好自身的核心业务,渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
					<div class="it_expertxt">
						<p class="it_expertit">88888888888[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业把招商的所有事情都可以外包给招商快车公司去做,企业只需要集中力量经营好自身的核心业务,渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
				</li>  
			</ul>
			<ul class="current" style="display: none;">  
				<li>
					<div class="it_expertxt">
						<p class="it_expertit">9999999999993[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业把招商的所有事情都可以外包给招商快车公司去做,企业只需要集中力量经营好自身的核心业务,渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
					<div class="it_expertxt">
						<p class="it_expertit">100000000000[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业把招商的所有事情都可以外包给招商快车公司去做,企业只需要集中力量经营好自身的核心业务,渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
					<div class="it_expertxt">
						<p class="it_expertit">1111111111111[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业把招商的所有事情都可以外包给招商快车公司去做,企业只需要集中力量经营好自身的核心业务,渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
					<div class="it_expertxt">
						<p class="it_expertit">444444444[2015-06-05]</p>
						<p class="it_experconter">招商外包,就是指企业企业把招商的所有事情都可以外包给招商快车公司经营好自身的核心业务,渠道建设交给招商快车,包括如下9点:渠道盈利模型、产品组合策略</p>
					</div>
				</li>  
			</ul>
		</div>
	</div>            
</div>
<script type="text/javascript">
	$(function(){    
         abc2();
    }); 
	function abc2(){
         var $obj = $('#hot_ranks2 ul');  
         var len  = $obj.length;  
         var i = 0;  
         $("#next2").click(function(){  
              i++;  
              if(i==len){  
                i = 0;  
              }  
              $obj.stop(true,true).hide().eq(i).fadeIn(600);  
              return false;  
         });      
         $("#previous2").click(function(){  
              i--;  
              if(i==-1){  
                i = len-1;  
              }  
              $obj.stop(true,true).hide().eq(i).fadeIn(600);  
              return false;  
         });  
    }
	$(".it_expertxt").hover(function(){
		$(this).find(".it_expertit").css("color","#fff");
		$(this).find(".it_experconter").css("color","#fff");
		var div = $(this).find(".it_expertit");
		var div2 = $(this).find(".it_experconter")
		div.addClass("dest").animate({left: 20}, 200);
		div2.addClass("dest").animate({left: 20}, 200);
	},function(){
		var div = $(this).find(".it_expertit");
		var div2 = $(this).find(".it_experconter")
		$(this).find(".it_expertit").css("color","#434343");
		$(this).find(".it_experconter").css("color","#7d858c");
		div.addClass("dest").animate({left: 0}, 200);
		div2.addClass("dest").animate({left: 0}, 200);
	});
</script>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 滚动切换 滚动条切换 滑动选项卡 滑动切换 选项卡切换 选项卡 切换 tab切换 页面切换 选项卡插件 切换插件 滑动手风琴 切换按钮 表单 表单美化 表单插件 表单美化插件 文字切换 文字选项卡 列表切换 翻页切换 按钮控制

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到