fzkdhotel/obj/Release/Package/PackageTmp/js/myfocus/自定义风格/tqq/demo.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>myFocus仿腾讯微博效果</title>
<style type="text/css">
body { background:#fff; padding:20px; }
/*=========mF_sd_tqq========*/
.mF_sd_tqq{width:566px;height:288px;position:relative;overflow:hidden;border:2px solid #E7E7E7;border-left:0;border-right:0;}
.mF_sd_tqq ul{padding:0 16px;width:534px;line-height:22px;float:left;position:absolute;}
.mF_sd_tqq ul li{float:left;padding:14px 0;width:100%;border-bottom:1px dashed #D8D8D8;}
.mF_sd_tqq ul li .img{float:left;width:50px;border:1px solid #D2D2D2;padding:1px;}
.mF_sd_tqq ul li .msg{float:right;width:468px;}
.mF_sd_tqq ul li .msg p{font-size:14px;}
.mF_sd_tqq ul li .msg .from{font-size:12px;color:#999;}
</style>
<script type="text/javascript" src="http://myfocus-js.googlecode.com/svn/trunk/myfocus-2.0.0.min.js"></script>
<script type="text/javascript">
myFocus.pattern.extend({//*********************tqq******************
	'mF_sd_tqq':function(settings,$){
		var $tqq=$(settings);
		var $msgUl=$tqq.find('.msgs');
		//PLAY
		$tqq.play(function(i,n){
			var last=$msgUl.find('li')[n-1],lastH=last.offsetHeight;
			$msgUl.slide({marginTop:lastH},800,function(){
				$msgUl[0].insertBefore(last,$msgUl[0].firstChild);
				$msgUl[0].style.marginTop=0+'px';
				$(last).fadeIn();
			});
		});
	}
});
//实例化
myFocus.set({
	id:'tqq',
	pattern:'mF_sd_tqq',
	time:3
});
</script>
</head>
<body>
<h2>myFocus tqq 风格(微博首页轮换)</h2>
<div id="tqq" class="mF_sd_tqq">
  <ul class="msgs">
    <li>
      <div class="img"><img src="img/1.jpg" /></div>
      <div class="msg">
        <p><strong>情天娃娃</strong>：快八点了，今天的工作暂告一段落，明天继续。肚子在咕咕叫了，是该补充能量的时候了。人是铁，饭是钢，一顿不吃饿得慌呀！</p>
        <p class="from">来自<span>iPhone</span></p>
      </div>
    </li>
    <li>
      <div class="img"><img src="img/2.jpg" /></div>
      <div class="msg">
        <p><strong>一沙一天堂</strong>：宝洁生活家的礼品收到了，一本杂志，好几种潘婷试用品，满满一盒。卓越快递给送来的。不错啊！</p>
        <p class="from">来自<span>网页</span></p>
      </div>
    </li>
    <li>