以下是 jQuery智能新闻速递插件代码 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!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>jQuery智能新闻速递插件代码</title>
<!--主要样式-->
<link rel="stylesheet" type="text/css" href="css/jquery.smarticker.css">
<!--可无视-->
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div class="container">
<div class="content border-top lightgray blue">
<div class="padding">
<h3>1. 基础</h3>
<div class="smarticker1">
<ul>
<li><a href="#">新闻标题 1</a></li>
<li><a href="#">新闻标题 2</a></li>
<li><a href="#">新闻标题 3</a></li>
<li><a href="#">新闻标题 4</a></li>
<li><a href="#">新闻标题 5</a></li>
<li><a href="#">新闻标题 6</a></li>
</ul>
</div>
<div class="smarticker2">
<ul>
<li><a href="#">新闻标题 1</a></li>
<li><a href="#">新闻标题 2</a></li>
<li><a href="#">新闻标题 3</a></li>
<li><a href="#">新闻标题 4</a></li>
<li><a href="#">新闻标题 5</a></li>
<li><a href="#">新闻标题 6</a></li>
</ul>
</div>
<div class="smarticker3">
<ul>
<li><a href="#">新闻标题 1</a></li>
<li><a href="#">新闻标题 2</a></li>
<li><a href="#">新闻标题 3</a></li>
<li><a href="#">新闻标题 4</a></li>
<li><a href="#">新闻标题 5</a></li>
<li><a href="#">新闻标题 6</a></li>
</ul>
</div>
</div>
</div>
<div class="content lightgray border-top green">
<div class="padding">
<h3>2. 类别和子类别部分</h3>
<p>如果你添加类别和子类别部分,smarticker将是这样的:</p>
<div class="smarticker4">
<ul>
<li data-subcategory="金融" data-category="谷歌新闻"><a href="#">世界上最可爱的飞机头</a></li>
<li data-subcategory="体育" data-category="雅虎新闻"><a href="#">雨倾泻在穆雷美国公开赛游行</a></li>
<li data-subcategory="财富" data-category="谷歌新闻"><a href="#">印度卢比上涨,尽管国际货币基金组织(IMF)救援投机</a></li>
<li data-subcategory="财富" data-category="今日美国"><a href="#">中国公司挖走谷歌高管</a></li>
<li data-subcategory="体育" data-category="新闻扫描"><a href="#">布伦南:Manziel暂停计数</a></li>
<li data-subcategory="科技" data-category="福克斯新闻"><a href="#">戴尔将一些工作在孤星之州</a></li>
<li data-subcategory="科技" data-category="Abc News"><a href="#">回到学校学生省钱的应用</a></li>
<li data-subcategory="财富" data-category="Usa Today"><a href="#">石油价格上涨抑制股市吗?</a></li>
<li data-subcategory="健康" data-category="Abc News"><a href="#">Pa。有争议的肺移植后女孩回家</a></li>
<li data-subcategory="金融" data-category="Yahoo News"><a href="#">石油高点,股票可能会推迟在叙利亚行动</a></li>
</ul>
</div>
<div class="smarticker5">
<ul>
<li data-subcategory="金融" data-category="谷歌新闻"><a href="#">世界上最可爱的飞机头</a></li>
<li data-subcategory="体育" data-category="雅虎新闻"><a href="#">雨倾泻在穆雷美国公开赛游行</a></li>
<li data-subcategory="财富" data-category="谷歌新闻"><a href="#">印度卢比上涨,尽管国际货币基金组织(IMF)救援投机</a></li>
<li data-subcategory="财富" data-category="今日美国"><a href="#">中国公司挖走谷歌高管</a></li>
<li data-subcategory="体育" data-category="新闻扫描"><a href="#">布伦南:Manziel暂停计数</a></li>
<li data-subcategory="科技" data-category="福克斯新闻"><a href="#">戴尔将一些工作在孤星之州</a></li>
<li data-subcategory="科技" data-category="Abc News"><a href="#">回到学校学生省钱的应用</a></li>
<li data-subcategory="财富" data-category="Usa Today"><a href="#">石油价格上涨抑制股市吗?</a></li>
<li data-subcategory="健康" data-category="Abc News"><a href="#">Pa。有争议的肺移植后女孩回家</a></li>
<li data-subcategory="金融" data-category="Yahoo News"><a href="#">石油高点,股票可能会推迟在叙利亚行动</a></li>
</ul>
</div>
<div class="smarticker6">
<ul>
<li data-subcategory="金融" data-category="谷歌新闻"><a href="#">世界上最可爱的飞机头</a></li>
<li data-subcategory="体育" data-category="雅虎新闻"><a href="#">雨倾泻在穆雷美国公开赛游行</a></li>
<li data-subcategory="财富" data-category="谷歌新闻"><a href="#">印度卢比上涨,尽管国际货币基金组织(IMF)救援投机</a></li>
<li data-subcategory="财富" data-category="今日美国"><a href="#">中国公司挖走谷歌高管</a></li>
<li data-subcategory="体育" data-category="新闻扫描"><a href="#">布伦南:Manziel暂停计数</a></li>
<li data-subcategory="科技" data-category="福克斯新闻"><a href="#">戴尔将一些工作在孤星之州</a></li>
<li data-subcategory="科技" data-category="Abc News"><a href="#">回到学校学生省钱的应用</a></li>
<li data-subcategory="财富" data-category="Usa Today"><a href="#">石油价格上涨抑制股市吗?</a></li>
<li data-subcategory="健康" data-category="Abc News"><a href="#">Pa。有争议的肺移植后女孩回家</a></li>
<li data-subcategory="金融" data-category="Yahoo News"><a href="#">石油高点,股票可能会推迟在叙利亚行动</a></li>
</ul>
</div>
</div>
</div>
<div class="content lightgray border-top orange">
<div class="padding">
<h3>3. 彩虹魔法</h3>
<p>如果你设置data-color新闻、颜色将动画和smarticker彩虹:</p>
<div class="smarticker5">
<ul>
<li data-subcategory="金融" data-category="谷歌新闻" data-color="14ab05"><a href="#">世界上最可爱的飞机头</a></li>
<li data-subcategory="体育" data-category="雅虎新闻" data-color="f45151"><a href="#">雨倾泻在穆雷美国公开赛游行</a></li>
<li data-subcategory="财富" data-category="谷歌新闻" data-color="23a0e8"><a href="#">印度卢比上涨,尽管国际货币基金组织(IMF)救援投机</a></li>
<li data-subcategory="财富" data-category="今日美国" data-color="14ab05"><a href="#">中国公司挖走谷歌高管</a></li>
<li data-subcategory="体育" data-category="新闻扫描" data-color="cf29b9"><a href="#">布伦南:Manziel暂停计数</a></li>
<li data-subcategory="科技" data-category="福克斯新闻" data-color="1979ab"><a href="#">戴尔将一些工作在孤星之州</a></li>
<li data-subcategory="科技" data-category="Abc News" data-color="f45151"><a href="#">回到学校学生省钱的应用</a></li>
<li data-subcategory="财富" data-category="Usa Today" data-color="ed4c4c"><a href="#">石油价格上涨抑制股市吗?</a></li>
<li data-subcategory="健康" data-category="Abc News" data-color="cf29b9"><a href="#">Pa。有争议的肺移植后女孩回家</a></li>
<li data-subcategory="金融" data-category="Yahoo News" data-color="f45151"><a href="#">石油高点,股票可能会推迟在叙利亚行动</a></li>
</ul>
</div>
<div class="smarticker6">
<ul>
<li data-subcategory="金融" data-category="谷歌新闻" data-color="14ab05"><a href="#">世界上最可爱的飞机头</a></li>
<li data-subcategory="体育" data-category="雅虎新闻" data-color="f45151"><a href="#">雨倾泻在穆雷美国公开赛游行</a></li>
<li data-subcategory="财富" data-category="谷歌新闻" data-color="23a0e8"><a href="#">印度卢比上涨,尽管国际货币基金组织(IMF)救援投机</a></li>
<li data-subcategory="财富" data-category="今日美国" data-color="14ab05"><a href="#">中国公司挖走谷歌高管</a></li>
<li data-subcategory="体育" data-category="新闻扫描" data-color="cf29b9"><a href="#">布伦南:Manziel暂停计数</a></li>
<li data-subcategory="科技" data-category="福克斯新闻" data-color="1979ab"><a href="#">戴尔将一些工作在孤星之州</a></li>
<li data-subcategory="科技" data-category="Abc News" data-color="f45151"><a href="#">回到学校学生省钱的应用</a></li>
<li data-subcategory="财富" data-category="Usa Today" data-color="ed4c4c"><a href="#">石油价格上涨抑制股市吗?</a></li>
<li data-subcategory="健康" data-category="Abc News" data-color="cf29b9"><a href="#">Pa。有争议的肺移植后女孩回家</a></li>
<li data-subcategory="金融" data-category="Yahoo News" data-color="f45151"><a href="#">石油高点,股票可能会推迟在叙利亚行动</a></li>
</ul>
</div>
<div class="smarticker7">
<ul>
<li data-subcategory="金融" data-category="谷歌新闻" data-color="14ab05"><a href="#">世界上最可爱的飞机头</a></li>
<li data-subcategory="体育" data-category="雅虎新闻" data-color="f45151"><a href="#">雨倾泻在穆雷美国公开赛游行</a></li>
<li data-subcategory="财富" data-category="谷歌新闻" data-color="23a0e8"><a href="#">印度卢比上涨,尽管国际货币基金组织(IMF)救援投机</a></li>
<li data-subcategory="财富" data-category="今日美国" data-color="14ab05"><a href="#">中国公司挖走谷歌高管</a></li>
<li data-subcategory="体育" data-category="新闻扫描" data-color="cf29b9"><a href="#">布伦南:Manziel暂停计数</a></li>
<li data-subcategory="科技" data-category="福克斯新闻" data-color="1979ab"><a href="#">戴尔将一些工作在孤星之州</a></li>
<li data-subcategory="科技" data-category="Abc News" data-color="f45151"><a href="#">回到学校学生省钱的应用</a></li>
<li data-subcategory="财富" data-category="Usa Today" data-color="ed4c4c"><a href="#">石油价格上涨抑制股市吗?</a></li>
<li data-subcategory="健康" data-category="Abc News" data-color="cf29b9"><a href="#">Pa。有争议的肺移植后女孩回家</a></li>
<li data-subcategory="金融" data-category="Yahoo News" data-color="f45151"><a href="#">石油高点,股票可能会推迟在叙利亚行动</a></li>
</ul>
</div>
<div class="smarticker8">
<ul>
<li data-subcategory="金融" data-category="谷歌新闻" data-color="14ab05"><a href="#">世界上最可爱的飞机头</a></li>
<li data-subcategory="体育" data-category="雅虎新闻" data-color="f45151"><a href="#">雨倾泻在穆雷美国公开赛游行</a></li>
<li data-subcategory="财富" data-category="谷歌新闻" data-color="23a0e8"><a href="#">印度卢比上涨,尽管国际货币基金组织(IMF)救援投机</a></li>
<li data-subcategory="财富" data-category="今日美国" data-color="14ab05"><a href="#">中国公司挖走谷歌高管</a></li>
<li data-subcategory="体育" data-category="新闻扫描" data-color="cf29b9"><a href="#">布伦南:Manziel暂停计数</a></li>
<li data-subcategory="科技" data-category="福克斯新闻" data-color="1979ab"><a href="#">戴尔将一些工作在孤星之州</a></li>
<li data-subcategory="科技" data-category="Abc News" data-color="f45151"><a href="#">回到学校学生省钱的应用</a></li>
<li data-subcategory="财富" data-category="Usa Today" data-color="ed4c4c"><a href="#">石油价格上涨抑制股市吗?</a></li>
<li data-subcategory="健康" data-category="Abc News" data-color="cf29b9"><a href="#">Pa。有争议的肺移植后女孩回家</a></li>
<li data-subcategory="金融" data-category="Yahoo News" data-color="f45151"><a href="#">石油高点,股票可能会推迟在叙利亚行动</a></li>
</ul>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/smarticker.js"></script>
</body>
</html>
JS代码(smarticker.js):
(function(d){
function m(){
var b=d("script:first"),a=b.css("color"),c=false;
if(/^rgba/.test(a))c=true;
else try{
c=a!=b.css("color","rgba(0,0,0,0.5)").css("color");
b.css("color",a)}
catch(e){
}
return c}
function j(b,a,c){
var e="rgb"+(d.support.rgba?"a":"")+"("+parseInt(b[0]+c*(a[0]-b[0]),10)+","+parseInt(b[1]+c*(a[1]-b[1]),10)+","+parseInt(b[2]+c*(a[2]-b[2]),10);
if(d.support.rgba)e+=","+(b&&a?parseFloat(b[3]+c*(a[3]-b[3])):1);
e+=")";
return e}
function g(b){
var a,c;
if(a=/#([0-9a-fA-F]{
2}
)([0-9a-fA-F]{
2}
)([0-9a-fA-F]{
2}
)/.exec(b))c=[parseInt(a[1],16),parseInt(a[2],16),parseInt(a[3],16),1];
else if(a=/#([0-9a-fA-F])([0-9a-fA-F])([0-9a-fA-F])/.exec(b))c=[parseInt(a[1],16)*17,parseInt(a[2],16)*17,parseInt(a[3],16)*17,1];
else if(a=/rgb\(\s*([0-9]{
1,3}
)\s*,\s*([0-9]{
1,3}
)\s*,\s*([0-9]{
1,3}
)\s*\)/.exec(b))c=[parseInt(a[1]),parseInt(a[2]),parseInt(a[3]),1];
else if(a=/rgba\(\s*([0-9]{
1,3}
)\s*,\s*([0-9]{
1,3}
)\s*,\s*([0-9]{
1,3}
)\s*,\s*([0-9\.]*)\s*\)/.exec(b))c=[parseInt(a[1],10),parseInt(a[2],10),parseInt(a[3],10),parseFloat(a[4])];
return c}
d.extend(true,d,{
support:{
rgba:m()}
}
);
var k=["color","backgroundColor","borderBottomColor","borderLeftColor","borderRightColor","borderTopColor","outlineColor"];
d.each(k,function(b,a){
d.Tween.propHooks[a]={
get:function(c){
return d(c.elem).css(a)}
,set:function(c){
var e=c.elem.style,i=g(d(c.elem).css(a)),h=g(c.end);
c.run=function(f){
e[a]=j(i,h,f)}
}
}
}
);
d.Tween.propHooks.borderColor={
set:function(b){
var a=b.elem.style,c=[],e=k.slice(2,6);
d.each(e,function(h,f){
c[f]=g(d(b.elem).css(f))}
);
var i=g(b.end);
b.run=function(h){
d.each(e,function(f,l){
a[l]=j(c[l],i,h)}
)}
}
}
}
)(jQuery);
(function(e){
e.fn.smarticker=function(t){
var n=e.extend({
}
,e.fn.smarticker.defaults,t);
return this.each(function(t){
function h(t,n){
var r=[];
e.each(t,function(t,i){
if(e.inArray(e(i).data(n),r)==-1&&e(i).data(n)!=undefined)r.push(e(i).data(n))}
);
return p(r)}
function p(e){
for(var t,n,r=e.length;
r;
t=parseInt(Math.random()*r),n=e[--r],e[r]=e[t],e[t]=n);
return e}
function d(){
if(n.category==false){
v()}
else{
e(".active-ag",r).removeClass("active-ag");
var t=e(".newsholder li",r).eq(u).data("category");
t=e(".smarticker-category ul li",r).index(e('.smarticker-category ul li[data-category="'+t+'"]',r));
e(".smarticker-category ul li",r).eq(t).addClass("active-ag");
t=e(".active-ag",r);
e(".smarticker-category",r).animate({
scrollTop:t.offset().top-t.parent().offset().top+t.parent().scrollTop()}
,n.speed-n.speed/2.5,function(){
if(n.subcategory!=false){
v()}
else{
m()}
var t=e(".newsholder",r).find("li").eq(u).data("color");
if(t!=undefined&&n.catcolor!=false){
e(".active-ag a",r).stop().animate({
color:"#"+t}
,n.speed-n.speed/2.5)}
else e(".active-ag a",r).stop().animate({
color:"#999"}
,n.speed-n.speed/2.5)}
)}
}
function v(){
if(n.subcategory==false){
m();
return false}
e(".active-cat",r).removeClass("active-cat");
var t=e(".newsholder li",r).eq(u).data("subcategory");
t=e(".smarticker-cats li",r).index(e('.smarticker-cats li[data-subcategory="'+t+'"]',r));
e(".smarticker-cats ul li",r).eq(t).addClass("active-cat");
t=e(".active-cat",r);
var i=t.parent();
if(e(".catlist",r).length>0)i=e(".catlist",r);
else i=e(".smarticker-cats",r);
i.animate({
scrollTop:Math.max(t.offset().top-i.offset().top+i.scrollTop(),0)}
,n.speed-n.speed/2.5,m);
var s=e(".newsholder",r).find("li").eq(u).data("color");
if(s!=undefined&&n.subcatcolor!=false){
e(".smarticker-cats li",r).animate({
backgroundColor:"#"+s}
,n.speed-n.speed/2.5)}
else e(".smarticker-cats li",r).animate({
backgroundColor:"#c3c3c3"}
,n.speed-n.speed/2.5)}
function m(){
e(".newsholder",r).css({
display:"block",height:"100%"}
);
f.css("width","100%").animate({
width:0}
,n.pausetime);
if(n.animation=="default"){
if(e(".activeRollerItem",r).length>0){
var t=e(".activeRollerItem",r);
t.animate({
top:-25,opacity:0}
,n.speed-n.speed/1.2,function(){
t.css("display","none")}
).removeClass("activeRollerItem")}
var i=e(".newsholder",r).find("li").eq(u).addClass("activeRollerItem");
i.css({
top:"25px",display:"block"}
).animate({
opacity:1,top:0}
,n.speed-n.speed/2.5,function(){
u++;
if(u==e(".newsholder",r).find("li").length)u=0;
nextInterval=setTimeout(d,n.pausetime)}
)}
if(n.animation=="slide"){
if(e(".activeRollerItem",r).length>0){
t=e(".activeRollerItem",r);
t.animate({
left:250,opacity:0}
,n.speed-n.speed/1.5,function(){
t.css("display","none")}
).removeClass("activeRollerItem")}
var i=e(".newsholder li",r).eq(u).addClass("activeRollerItem");
i.css({
left:"-150px",display:"block",opacity:"1"}
).animate({
opacity:1,left:10}
,n.speed-n.speed/3,function(){
u++;
if(u==e(".newsholder li",r).length)u=0;
nextInterval=setTimeout(d,n.pausetime)}
)}
if(n.animation=="fade"){
if(e(".activeRollerItem",r).length>0){
t=e(".activeRollerItem",r);
t.fadeOut(n.speed/2,function(){
t.removeClass("activeRollerItem")}
)}
var i=e(".newsholder li",r).eq(u).addClass("activeRollerItem");
i.css({
top:"0",display:"none"}
).fadeIn(n.speed/2,function(){
u++;
if(u==e(".newsholder li",r).length)u=0;
nextInterval=setTimeout(d,n.pausetime)}
)}
if(n.animation=="typing"){
if(e(".activeRollerItem",r).length>0){
t=e(".activeRollerItem",r);
var s=e('<div class="hider"></div>');
s.prependTo(e(".smarticker-news",r)).css({
width:"0px",left:"0px",height:"100%",position:"absolute","background-color":r.css("background-color"),"z-index":"2"}
);
s.animate({
width:t.width()+30}
,n.speed,function(){
t.fadeOut(100,function(){
t.css("opacity","0").removeClass("activeRollerItem");
s.fadeOut(100,function(){
var t=e(".newsholder li",r).eq(u).addClass("activeRollerItem").css({
display:"block",opacity:"1"}
);
s.remove();
var i=e('<div class="cover"><div class="flasher">_</div></div>');
i.prependTo(e(".smarticker-news",r));
i.css({
"background-color":r.css("background-color")}
);
i.animate({
left:t.width()+30}
,t.width()*8,function(){
i.remove();
u++;
if(u==e(".newsholder li",r).length)u=0;
nextInterval=setTimeout(d,n.pausetime)}
)}
)}
)}
)}
else{
var i=e(".newsholder li",r).eq(u).addClass("activeRollerItem").css({
display:"block",opacity:"1"}
);
var o=e('<div class="cover"><div class="flasher">_</div></div>');
o.prependTo(e(".smarticker-news",r));
o.css({
"background-color":r.css("background-color")}
);
o.animate({
left:i.width()+30}
,i.width()*8,function(){
o.remove();
if(c==0){
u++;
if(u==e(".newsholder li",r).length)u=0;
nextInterval=setTimeout(d,n.pausetime)}
}
)}
}
}
var r=e(this);
var i=e("li",r);
var s=e('<div class="smarticker-cats"><ul></ul></div>');
var o=e('<div class="smarticker-category"><ul></ul></div>');
var u=n.startindex;
var a=e('<div class="smart-controller"><span class="prev-news">Previous</span><span class="next-news">Next</span></div>');
var f=e('<div class="progress-bar"></div>');
var l=e('<div class="sec1-2 tickertitle"></div>');
var c=0;
r.addClass("smarticker").wrapInner('<div class="smarticker-news"></div>');
if(h(i,"subcategory").length<1)n.subcategory=false;
if(h(i,"category").length<1)n.category=false;
if(n.subcategory==true){
s.prependTo(r).addClass("sec1-2");
e.each(h(i,"subcategory"),function(e,t){
s.find("ul").append('<li data-subcategory="'+t+'"><a>'+t+"</a></li>")}
);
if(n.theme==1||n.theme==2){
s.find("ul").wrap('<div class="catlist"></div>');
s.append('<span class="right"></span>').prepend('<span class="left"></span>')}
}
if(n.category==true&&h(i,"category").length>0){
o.prependTo(r).addClass("sec1-2");
e.each(h(i,"category"),function(e,t){
o.find("ul").append('<li data-category="'+t+'"><a>'+t+"</a></li>")}
)}
if(n.progressbar==true)f.appendTo(e(".smarticker-news",r));
if(n.controller==true)a.appendTo(e(".smarticker-news",r));
if(n.category==false)r.addClass("no-category");
if(n.subcategory==false)r.addClass("no-subcategory");
r.addClass("theme"+n.theme);
r.addClass("box size1");
r.addClass("c"+n.controllertype);
e(".smarticker-news",r).addClass("sec7 newsholder hidden");
e(".smarticker-news > ul",r).attr("id","newsholder").addClass("newsholder hidden");
if(n.rounded==true)r.addClass("rounded");
if(n.direction=="rtl")r.addClass("rtl");
if(n.border==true)r.addClass("border");
if(n.shadow==true)r.addClass("shadow");
if(n.category==false||n.subcategory==false){
e(".smarticker-news",r).removeClass("sec7").addClass("sec10")}
if(n.category==false&&n.subcategory==false&&n.titlesection==true){
e(".smarticker-news",r).removeClass("sec7").addClass("sec10");
l.prependTo(r).text(n.title)}
d()}
)}
;
e.fn.smarticker.defaults={
theme:1,animation:"default",speed:1e3,startindex:0,pausetime:3e3,rounded:false,shadow:true,border:false,category:true,subcategory:true,titlesection:true,title:"Headlines",progressbar:false,catcolor:true,subcatcolor:true}
}
)(jQuery)$(".smarticker1").smarticker({
title:"头条"}
);
$(".smarticker2").smarticker({
theme:2,title:"新闻",speed:2e3,pausetime:4e3}
);
$(".smarticker3").smarticker({
theme:4,speed:1500,pausetime:3600,title:"最新动态",rounded:true,animation:"typing"}
);
$(".smarticker4").smarticker({
theme:2,rounded:true,animation:"fade",speed:2500}
);
$(".smarticker5").smarticker();
$(".smarticker6").smarticker({
theme:2,animation:"typing",speed:2e3,pausetime:5e3,rounded:true,catcolor:false}
);
$(".smarticker7").smarticker({
theme:3,animation:"slide",speed:1e3,progressbar:true}
);
$(".smarticker8").smarticker({
theme:4,animation:"slide",speed:2e3,rounded:true}
)
CSS代码(style.css):
/* ---------------------Author:Meghdad HadidiFacebook:/meghdad.hadidiTwitter:@meghdadhadidiGmail:meghdadhadidi1@gmail.comURI:http://powerup.ir/projects/smarticker------------------------*/
body{text-align:center;margin:0;padding:0;}
pre.prettyprint{padding:15px;border:1px solid #ccc;border-radius:5px;overflow:hidden;font-size:12px;/*color:#777;font-size:13px;display:block;margin:10px 0 20px;background:#fefefe;*/
}
pre.prettyprint:hover{overflow:auto;}
pre strong{color:#cd2122;}
pre.small{}
pre span.com{color:#999;}
h3{font-size:20px;}
code{border:1px solid #ccc;border-radius:3px;padding:1px 5px;background:#fff;color:#a1a1a1;font-size:12px;}
.container{width:70%;margin:0 auto;min-height:100px;background:#fcfcfc;box-shadow:0px 0px 3px #ccc;}
.top-bar{position:fixed;top:0px;width:100%;/*background:#f9f9f9;border-bottom:3px solid #e6e6e6;*/
z-index:10;}
.top-bar div{width:12.5%;float:left;}
.logo{float:left;}
.scroll-nav{position:fixed;top:20px;}
.scroll-nav ol{list-style:none;direction:ltr;text-align:left;padding:0 0 0 10px;margin:0;}
.scroll-nav ol li a{text-decoration:none;font-family:Calibri,Tahoma;font-size:13px;color:#666;}
.scroll-nav ol li.active a{font-weight:bold;}
.header{font-family:Times New Roman;}
.container .header h1{font-style:italic;font-weight:bold;color:#666;margin-top:0;margin-bottom:0px;padding-top:20px;}
.container .header h5{margin-top:5px;margin-bottom:0px;color:#666;font-weight:normal;}
.container .header h6{font-weight:normal;color:#999;margin-top:10px;font-style:italic;font-family:calibri,Tahoma;font-size:13px;}
.content{direction:ltr;text-align:left;line-height:21px;font-family:Calibri,Tahoma;font-size:14px;color:#666;}
.col{float:left;min-height:50px;}
.col1{width:33%;}
.col2{width:66%;}
.right{float:right;}
.content .col:last-child,.cf{clear:both;float:none;display:block;min-height:0;height:0;font-size:0;line-height:0;}
.padding{padding:15px 25px;}
.border-bottom{border-bottom:3px solid #ccc;}
.border-top{border-top:3px solid #ccc;}
.blue{background:#3498db;color:#f9f9f9;border-color:#3498db;}
.yellow{border-color:#f4ec0b;}
.green{border-color:#2ecc71;}
.darkgreen{border-color:#16a085;}
.darkblue{border-color:#2980b9;}
.red{border-color:#fe331e;}
.gray{background:#eee;color:#666;}
.purple{border-color:#9b59b6;}
.orange{border-color:#f39c12;}
.purple1{border-color:#ef00c5;}
.lightgray{background-color:#fcfcfc;color:#666;}
.red::selection{background:#ffb7b7;}
.red::-moz-selection{background:#ffb7b7;}
p.blue::selection{background:#f1c40f;}
p.blue::-moz-selection{background:#f1c40f;}
.yellow::selection{background:#fff2a8;}
.yellow::-moz-selection{background:#fff2a8;}
.smarticker{margin-bottom:30px;}