文章详情

  • 游戏榜单
  • 软件榜单
关闭导航
热搜榜
热门下载
热门标签
php爱好者> php文档>下拉弹簧首页效果 - java教程,javascript教程-

下拉弹簧首页效果 - java教程,javascript教程-

时间:2010-08-28  来源:深圳的天空

 

<!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=gb2312" />
<meta http-equiv="PRAGMA" content="NO-CACHE" />
<title></title>
<style type="text/css">...
body
{...}{ margin:0; text-align:center;font-size:12px;}
.papanel,#pabd,.paft,#patop
{...}{width:348px;}
.papanel
{...}{background:#a5d0fd url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102751265.gif" alt="" title=""/>) repeat-x;border-left:1px solid #7bbdff;border-right:1px solid #7bbdff;font-family:arial;}
#pabd
{...}{padding-bottom:.35em;background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102754216.gif" alt="" title=""/>) no-repeat top left;}
#pabd,.paft
{...}{clear:both;overflow:hidden;}
#patop
{...}{height:25px;line-height:20px;overflow:hidden;}
/**//*顶部圆角开始*/
.pabdt
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102754803.gif" alt="" title=""/>) 0 0 no-repeat;width:350px;height:4px;overflow:hidden;}
.pabdb
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102754803.gif" alt="" title=""/>) 0 -4px no-repeat;width:350px;height:3px;overflow:hidden;}
.paft
{...}{height:4px;line-height:0;}
/**//*顶部圆角结束*/
.patabs
{...}{width:340px;margin:0 auto;}
.patabslst
{...}{margin:.25em 0 0 0;padding:0;list-style:none;height:40px;}
.patabslst li
{...}{float:left;position:relative;width:112px;height:40px;line-height:40px;text-align:center;}
.patabslst li a
{...}{display:block;width:109px;height:40px;}
/**//*内置背景开始*/
.papreviewdiv
{...}{position:relative;clear:both;width:338px;_width /**//* */:340px;margin:0 auto;background:#fff; border-left:1px solid #85c3ff;border-right:1px solid #5ca3e9;display:none;}
/**//*外部小图标开始*/
.icomailn
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755560.gif" alt="" title=""/>) 0 0 no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755560.gif", sizingMethod='crop');}
.icomail
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755503.gif" alt="" title=""/>) 0 0 no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755503.gif", sizingMethod='crop');}
.icoalb
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755904.gif" alt="" title=""/>) 0 0 no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755904.gif", sizingMethod='crop');}
.icomus
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755412.gif" alt="" title=""/>) 0 0 no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755412.gif", sizingMethod='crop');}
.icofin
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755757.gif" alt="" title=""/>) 0 0 no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755757.gif", sizingMethod='crop');}
.icoalqq
{...}{background:url("/webhtml/UploadFiles_8980/200711/20071111102755120.gif") 0 0 no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102755120.gif", sizingMethod='crop');}
/**//*内置图标开始*/
.pamailcon,.pamywebcon
{...}{float:left;text-align:left;line-height:1.5em;background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756303.gif" alt="" title=""/>) 2em 2em no-repeat;padding:1.5em 0 0 10em;}
.pamailcon strong,.pamywebcon strong
{...}{color:#ff0000;}
.pasmscon,.pamywebcon
{...}{float:left;text-align:left;line-height:1.5em;background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756303.gif" alt="" title=""/>) 1em 1.5em no-repeat;padding:1.5em 0 0 8em;}
.pasmscon strong,.pamywebcon strong
{...}{color:#ff0000;}
.paemailcon,.pamywebcon
{...}{float:left;text-align:left;line-height:1.5em;background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756303.gif" alt="" title=""/>) 1em 1.5em no-repeat;padding:1.5em 0 0 8em;}
.paemailcon strong,.pamywebcon strong
{...}{color:#ff0000;}
.paqqcon,.pamywebcon
{...}{float:left;text-align:left;line-height:1.5em;background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756303.gif" alt="" title=""/>) 1em 1.5em no-repeat;padding:1.5em 0 0 8em;;}
.paqqcon strong,.pamywebcon strong
{...}{color:#ff0000;}
.pafaxcon,.pamywebcon
{...}{float:left;text-align:left;line-height:1.5em;background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756303.gif" alt="" title=""/>) 1em 1.5em no-repeat;padding:1.5em 0 0 8em;;}
.pafaxcon strong,.pamywebcon strong
{...}{color:#ff0000;}
.patxcon,.pamywebcon
{...}{float:left;text-align:left;line-height:1.5em;background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756303.gif" alt="" title=""/>) 1em 1.5em no-repeat;padding:1.5em 0 0 8em;;}
.patxcon strong,.pamywebcon strong
{...}{color:#ff0000;}
/**//*背景开始*/
.patabs2,.patabs1
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756643.gif" alt="" title=""/>) no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756643.gif", sizingMethod='crop');}
.patabs1_pamail,.patabs2_paweath
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756292.gif" alt="" title=""/>) no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756292.gif", sizingMethod='crop');}
.patabs1_paalb,.patabs2_pafin
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756984.gif" alt="" title=""/>) no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756984.gif", sizingMethod='crop');}
.patabs1_pamus,.patabs2_pamyw
{...}{background:url(<img onload="ResizeImage(this,520)" src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756976.gif" alt="" title=""/>) no-repeat;*background:transparent;*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.shaoqun.com/webhtml/UploadFiles_8980/200711/20071111102756976.gif", sizingMethod='crop');}
#patabs1 strong,#patabs2 strong
{...}{color:#0062c5;font-size:13px;margin-left:2em;}
#patabs1 a,#patabs2 a
{...}{text-decoration:none;}
</style>
<script type="text/javascript">...
ycn
=window.ycnui||...{};
ycn.Common
=new function()...{this.lTrim=function(i)...{return i.replace(/^"s*/,"");};this.rTrim=function(i)...{return i.replace(/"s*$/,"");};this.trim=function(i)...{return this.rTrim(this.lTrim(i));};this.getEl=function(i)...{if(!document.getElementById)return false;if(typeof i==="string")...{return document.getElementById(i);}else...{return i;}};this.getElByClassName=function(t,n,s,el)...{var el=(el)?el:document;var itm=el.getElementsByTagName(t);var num=1;for(i=0;i<itm.length;i++)...{if(itm[i].className===n&&s===num)...{return itm[i];}else if(itm[i].className===n)...{num++;}}
return false;}
;
this.isIE6=function()...{return navigator.userAgent.search('MSIE')>0&&navigator.userAgent.search('6')>0;}
this.isIE=function()...{return navigator.userAgent.search('MSIE')>0;}
this.isOpera=function()...{return navigator.userAgent.indexOf('Opera')>-1;}
this.isMoz=function()...{return navigator.userAgent.indexOf('Mozilla/5.')>-1;}
}
;
/**//*事件*/
ycn
=window.ycn||...{};
ycn.Event
=...{
addEvent:
function (obj,evType,fn)...{
if(obj.addEventListener)
...{
obj.addEventListener(evType,fn,
false);
return true;
}
else if(obj.attachEvent)...{
var r=obj.attachEvent("on"+evType,fn);
ycn.EventCache.add(obj,evType,fn);
return r;
}
else...{return false;}
}
,
removeEvent:
function (obj,evType,fn)...{
if(obj.removeEventListener)...{
obj.removeEventListener(evType,fn,
false);
return true;
}
else if(obj.detachEvent)...{
var r=obj.detachEvent("on"+evType,fn);
return r;
}
else...{return false;}
}
,
getEvent:
function (e)
...{
e
=window.event||e;
e.leftButton
=false;
if(e.srcElement==null&&e.target!=null)
...{
e.srcElement
=e.target;
e.leftButton
=(e.button==1);

}
else if(e.target==null&&e.srcElement!=null)...{
e.target
=e.srcElement;
e.leftButton
=(e.button==0);
}
else if(e.srcElement!=null&&e.target!=null)...{
}
else...{return null}
if(document.body&&document.documentElement)
...{
e.mouseX
=e.pageX||(e.clientX+Math.max(document.body.scrollLeft,document.documentElement.scrollLeft));
e.mouseY
=e.pageY||(e.clientY+Math.max(document.body.scrollTop,document.documentElement.scrollTop));
}
else...{
e.mouseX
=-1;
e.mouseY
=-1;
}

return e;
}
,
stopEvent:
function (e)
...{
if(e&&e.cancelBubble!=null)
...{
e.cancelBubble
=true;
e.returnValue
=false;
}

if(e&&e.stopPropagation&&e.preventDefault)
...{
e.stopPropagation();
e.preventDefault();
}

return false;
}

}
;
ycn.EventCache
=function()
...{
var listEvents=[];
return ...{
listEvents:listEvents,add:
function (node,sEventName,fHandler,bCapture)...{
listEvents[listEvents.length]
=arguments;
}
,flush:function ()...{
var i,item;
for(i=listEvents.length-1;i>=0;i=i-1)
...{
item
=listEvents[i];
if(item[0].removeEventListener)...{item[0].removeEventListener(item[1],item[2],item[3]);};
if(item[1].substring(0,2)!="on")...{item[1]="on"+item[1];};
if(item[0].detachEvent)...{item[0].detachEvent(item[1],item[2]);};
item[
0][item[1]]=null;
}
;
}

}
;
}
();
/**//*这里*/
var _rnd=Math.random();
var pa_m=...{mail_api:""+_rnd,album_api:""+_rnd,mus_api:""+_rnd,weath_api:""+_rnd,fin_api:""+_rnd,myweb_api:""+_rnd,is_request:true,conobj:null,pa_panel:null,pa_con_ background-color: #f5f5f5">100,pa_cur_con:null,pa_cur_pre:null,close_timer:null,wait_timer:null,wait_close_timer:null,is_in_anim:false,is_in_pa:true,is_load_da:false,musicbox:...{noconid:"pamus_no",conid:"pamus_con"}};function string_len(str,len)...{if(str.length>len)...{return str.substring(0,len)+"..";}return str;}
function pa_preview_cont(pa,id)...{
if(pa_m.conobj!=null&&pa_m.is_load_da)...{ycn.Connect.abort(pa_m.conobj);}
var cb=...{scope:this,success:null,failure:null,arguments:null};
pa.innerHTML
=pa_m.loadstr;
pa_m.is_load_da
=true;
switch(id)
...{
case 'pamail':
var m_html="<div class='pasmscon'><b>我的设计家园</b>我的设计家园</b>我的设计家园<br/><br/></div>";
pa.innerHTML
=m_html;
break;
case 'paalb':
var m_html="<div class='pasmscon'><b>我的设计家园</b>我的设计家园</b>我的设计家园<br/><br/></div>";
pa.innerHTML
=m_html;
break;
case 'pamus':
var m_html="<div class='paemailcon'>我的设计家园<br/>我的设计家园<br/>我的设计家园<br/></div>";
pa.innerHTML
=m_html;
break;
case 'paweath':
var m_html="<div class='paqqcon'>我的设计家园<br/>我的设计家园<br/>我的设计家园<br/></div>";
pa.innerHTML
=m_html;
break;
case 'pafin':
var m_html="<div class='pafaxcon'>我的设计家园<br/>我的设计家园<br/><br/></div>";
pa.innerHTML
=m_html;
break;
case 'pamyw':
var m_html="<div class='patxcon'><b>我的设计家园</b>我的设计家园<br/><b>我的设计家园</b>我的设计家园<br/><b>我的设计家园</b>我的设计家园 <br/></div>";
pa.innerHTML
=m_html;
break;
default:pa_m.is_load_da=false;
pa.innerHTML
=pa_m.warnstr;
break;
}
;
}

function disp_pa_preview(el)...{
if(!pa_m.is_in_pa||pa_m.pa_cur_pre==el.id)...{return ;}
var p=el.parentNode;
while(p.tagName.toLowerCase()!='ul'&&p.tagName.toLowerCase()!='body')...{p=p.parentNode;}
if(p.tagName.toLowerCase()!='ul')...{return ;}
var con=ycn.Common.getEl(p.id+"previewdiv");
if(!con)...{return ;}
pa_m.pa_cur_pre
=el.id;
if(pa_m.pa_cur_con!=null&&pa_m.pa_cur_con!=con)...{
con.innerHTML
='';
var o_con=pa_m.pa_cur_con;
o_con.innerHTML
='';
if(ycn.Common.getEl(o_con.id.replace("previewdiv","")))...{
var o_tabs=ycn.Common.getEl(o_con.id.replace("previewdiv",""));
o_tabs.className
="patabslst "+o_tabs.id;
}

var m=(o_con.offsetHeight)?o_con.offsetHeight:pa_m.pa_con_height;
o_con.style.visibility
="hidden";
o_con.style.overflow
="hidden";
var close_con=function ()...{
m
-=30;
if(m<=0)...{
o_con.style.height
=0;
o_con.style.display
="none";
window.clearInterval(tt_1)
}
else...{
o_con.style.height
=m+"px";
}

}

var tt_1=window.setInterval(close_con,1);
}

var class_name=p.id+"_"+el.id;
el.parentNode.parentNode.className
=(el.parentNode.parentNode.className.indexOf(class_name)>0)?el.parentNode.parentNode.className:"patabslst "+class_name;
var n=(con.offsetHeight)?con.offsetHeight:0;
pa_m.is_in_anim
=true;
pa_m.pa_cur_con
=con;
con.style.visibility
="visible";
con.style.display
="block";
con.style.overflow
="hidden";
var open_con=function()...{
n
+=30;
if(n>=pa_m.pa_con_height)...{
con.style.height
=pa_m.pa_con_height+"px";
con.style.overflow
="visible";
pa_m.is_in_anim
=false;
pa_preview_cont(con,el.id);
window.clearInterval(tt_0);
}
else...{con.style.height=n+"px";}
}

var tt_0=window.setInterval(open_con,1);
}

function do_wait_open(e)...{
if(pa_m.is_in_anim||pa_m.is_in_pa)...{return ;}
if(ycn.Common.isIE())...{var el=window.event.srcElement;}else...{var el=this;}
while(el.tagName.toLowerCase()!='li'&&el.tagName.toLowerCase()!='body')...{el=el.parentNode;}
if(el.tagName.toLowerCase()!='li')...{return ;}
el
=el.getElementsByTagName('a')[0];
if(pa_m.wait_timer)...{window.clearTimeout(pa_m.wait_timer);}
pa_m.wait_timer
=window.setTimeout(function ()...{disp_pa_preview(el);},200);
}

function keep_pre_con(e)...{
if(pa_m.is_in_anim||pa_m.is_in_pa)...{return ;}
if(pa_m.wait_close_timer!=null)...{window.clearTimeout(pa_m.wait_close_timer);}
if(pa_m.wait_timer)...{window.clearTimeout(pa_m.wait_timer);}
ycn.Event.stopEvent(ycn.Event.getEvent(e));
}

function keep_pa_preview(e)...{
pa_m.is_in_pa
=true;
if(pa_m.wait_close_timer!=null)...{window.clearTimeout(pa_m.wait_close_timer);}
ycn.Event.stopEvent(ycn.Event.getEvent(e));
}

function close_pa_preview(e)...{
pa_m.is_in_pa
=false;
pa_m.wait_close_timer
=window.setTimeout(function ()...{do_close_pa(e)},2000);
ycn.Event.stopEvent(ycn.Event.getEvent(e));
}

function do_close_pa(e)...{
if(pa_m.is_in_pa)...{return ;}
if(pa_m.is_in_anim)...{return ;}
pa_m.is_in_anim
=true;
var o_con=pa_m.pa_cur_con;
if(!o_con)...{pa_m.is_in_anim=false;return ;}
if(ycn.Common.getEl(o_con.id.replace("previewdiv","")))...{
var o_tabs=ycn.Common.getEl(o_con.id.replace("previewdiv",""));
o_tabs.className
="patabslst "+o_tabs.id;
}

var m=(o_con.offsetHeight)?o_con.offsetHeight:pa_m.pa_con_height;
o_con.innerHTML
='';
o_con.style.visibility
="hidden";
o_con.style.overflow
="hidden";
var close_con=function ()...{
m
-=30;
if(m<=0)...{
o_con.style.height
=0;
o_con.style.display
="none";
pa_m.is_in_anim
=false;
pa_m.pa_cur_con
=null;
pa_m.pa_cur_pre
=null;
window.clearInterval(pa_m.close_timer);
}
else...{o_con.style.height=m+"px";}
}

pa_m.close_timer
=window.setInterval(close_con,1);
}

function init_pa_tabs()...{
var pa=ycn.Common.getEl('pabd');
var patabs1=ycn.Common.getEl('patabs1');
var patabs2=ycn.Common.getEl('patabs2');
if(!pa||!patabs1||!patabs2)return;
pa_m.pa_panel
=pa;
var prediv=new Array;
prediv[
0]=ycn.Common.getElByClassName('div','papreviewdiv',1,pa);
prediv[
1]=ycn.Common.getElByClassName('div','papreviewdiv',2,pa);
if(!prediv[0]||!prediv[1])...{return ;}
var tabs1=patabs1.getElementsByTagName('li');
var tabs2=patabs2.getElementsByTagName('li');
for(var i=0;i<tabs1.length;i++)...{ycn.Event.addEvent(tabs1[i],'mouseover',do_wait_open);}
for(var i=0;i<tabs2.length;i++)...{ycn.Event.addEvent(tabs2[i],'mouseover',do_wait_open);}
ycn.Event.addEvent(pa,
'mouseout',close_pa_preview);
ycn.Event.addEvent(pa,
'mouseover',keep_pa_preview);
ycn.Event.addEvent(prediv[
0],'mouseover',keep_pre_con);
ycn.Event.addEvent(prediv[
1],'mouseover',keep_pre_con);
if(ycn.Common.getEl('patop'))...{ycn.Event.addEvent(ycn.Common.getEl('patop'),'mouseover',function ()...{if(pa_m.wait_timer)...{clearTimeout(pa_m.wait_timer);}});}
}

</script>
</head>
<body>
<br />
<div class="pabdt"></div>
<div class="papanel">
<div id="pabd">
<div id="patop">
<div class="patopl"></div>
<div class="patopr"></div>
</div>
<div class="patabs">
<ul id="patabs1" class="patabslst patabs1">
<li><a id="pamail" href="#" class="icomus"><strong>音乐</strong></a></li>
<li><a id="paalb" href="#" class="icoalb"><strong>相册</strong></a></li>
<li><a id="pamus" href="#" class="icomail"><strong>邮箱</strong></a></li>
</ul>
<div id="patabs1previewdiv" class="papreviewdiv"></div>
</div>
<div class="patabs">
<ul id="patabs2" class="patabslst patabs2">
<li><a id="paweath" href="#" class="icoalqq"><strong>天气</strong></a></li>
<li><a id="pafin" href="#" class="icofin"><strong>股市</strong></a></li>
<li><a id="pamyw" href="#" class="icomailn"><strong>简装</strong></a></li>
</ul>
<div id="patabs2previewdiv" class="papreviewdiv"></div>
</div>
</div>
</div>
<div class="pabdb"></div>
<script type="text/javascript">...init_pa_tabs();</script>
</body>
</html>

相关阅读 更多 +
排行榜 更多 +
辰域智控app

辰域智控app

系统工具 下载
网医联盟app

网医联盟app

运动健身 下载
汇丰汇选App

汇丰汇选App

金融理财 下载