书签分享收藏举报版权申诉 / 14

立即下载加入VIP,免费下载

当前位置：首页 > 法律文书 > 调解书 > html5精妙代码.docx

html5精妙代码.docx

文档编号：6859839
上传时间：2023-01-11
格式：DOCX
页数：14
大小：19.22KB

html5精妙代码.docx

《html5精妙代码.docx》由会员分享，可在线阅读，更多相关《html5精妙代码.docx（14页珍藏版）》请在冰豆网上搜索。

html5精妙代码.docx

html5精妙代码

1

2

--willdownloadas"expenses.pdf"-->

DownloadYourExpenseReport

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

DOCTYPEHTML>

YourWebsite

Articletitle

Postedon

31:

24+02:

00">September4th2009byWriter-6comments

Pellentesquehabitantmorbitristiquesenectusetnetusetmalesuadafamesacturpisegestas.

Articletitle

Postedon

31:

24+02:

00">September4th2009byWriter-6comments

Pellentesquehabitantmorbitristiquesenectusetnetusetmalesuadafamesacturpisegestas.

.HTML5页面结构（见上）

同一页面显示

简洁TAB

functionnTabs（thisObj,Num）{

if（thisObj.className=="active"）return;

vartabObj=thisObj.parentNode.id;

vartabList=document.getElementById（tabObj）.getElementsByTagName（"li"）;

for（i=0;i

{

if（i==Num）

{

thisObj.className="active";

document.getElementById（tabObj+"_Content"+i）.style.display="block";

}else{

tabList[i].className="normal";

document.getElementById（tabObj+"_Content"+i）.style.display="none";

}

--

*{margin:

0;padding:

0;list-style:

none;font-size:

14px}

.nTab{width:

500px;margin:

20pxauto;background:

#aaa;border:

1pxsolid#333;overflow:

hidden}

.none{display:

none;}

.nTab.TabTitleli{float:

left;cursor:

pointer;height:

30px;line-height:

30px;font-weight:

bold;text-align:

center;width:

124px}

.nTab.TabTitlelia{text-decoration:

none;}

.nTab.TabTitle.active{background:

#ccc;color:

#336699}

.nTab.TabTitle.normal{background:

#666;color:

#fff}

.nTab.TabContent{clear:

both;overflow:

hidden;background:

#fff;padding:

5px;display:

block}

-->

ASP

PHP

同一页面，滑动门，选项卡同在

兼容性好

QQ下拉折叠菜单

DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

仿QQ的下拉折叠菜单

body{font-size:

76%}

#list{width:

250px;border-top:

1pxsolid#000}

#listdt{text-align:

center;font-weight:

bold;color:

#779;padding:

5px;cursor:

pointer;background:

#cce;border-width:

01px1px1px;border-color:

#333;border-style:

solid}

#listdd{margin-left:

0;display:

none;padding:

20px;border-width:

01px1px1px;border-color:

#333;border-style:

solid}

#listdd.vis{display:

block}

h2{font-weight:

bold;font-size:

1.2em}

p{margin-left:

15px;color:

#666}

functionall（arr,func）

{

for（vari=0,a;a=arr[i];i++）

{

func（a）;

}

functionshow（event）

{

vare=event||window.event;

varsrc=e.srcElement||e.target;

defins=document.getElementById（'list'）.getElementsByTagName（'dd'）;

all（defins,function（d）{if（d.className!

=''）{d.className='';}}）;

nextSib=src.nextSibling;

while（nextSib.nodeType!

=1）

{

nextSib=nextSib.nextSibling;

}

nextSib.className='vis';

}

functioninit（）

{

titles=document.getElementById（'list'）.getElementsByTagName（'dt'）;

all（titles,function（t）{t.onclick=show}）;

}

window.onload=init;

星期一

星期一开始了

忙碌的一周又开始了，朋友你预备好了吗？

星期二

星期二怎么样呢？

是不是开始放松自己了呢？

星期三

听人说：

过了星期三，一天快一天！

！

星期四

研究一下AJAX

预备把网站加进AJAX

星期五

明天就要解放了！

真是兴奋，可以和老婆在一起了！

期盼啊……。

折叠菜单同一页显示

DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http:

//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

//www.w3.org/1999/xhtml">

另类的折叠菜单

functionmenu（x,y）{

for（vari=0;i

if（x[i].style.display==''）{

x[i].style.display='none';

y.src='

}else{

x[i].style.display='';

y.src='

}

模板无忧

pointer">ASP源代码

none">

模板无忧精选的ASP源代码，经过测试，放心下载。

none">

pointer">PHP源代码

none">

PHP源代码，欢迎来到

none">

照片滚动

图片滚动

hidden;width:

100%;text-align:

center;border:

1pxsolid#0066cc">

varspeed=30;

marquee_product2.innerHTML=marquee_product1.innerHTML;

functionMarquee（）{

if（marquee_demo.scrollLeft>=marquee_product1.scrollWidth）{

marquee_demo.scrollLeft=0;

}

else{

marquee_demo.scrollLeft++;

}

varMyMar=setInterval（Marquee,speed）;

marquee_demo.onmouseover=function（）{clearInterval（MyMar）;}

marquee_demo.onmouseout=function（）{MyMar=setInterval（Marquee,speed）;}

经典图片切换

DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http:

//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

//www.w3.org/1999/xhtml">

经典的图片幻灯

.d1{width:

443px;height:

auto;overflow:

hidden;border:

#6666661pxsolid;background-color:

#000000;position:

relative;}

.loading{width:

443px;border:

#6666661pxsolid;background-color:

#000000;color:

#FFCC00;font-size:

12px;height:

179px;text-align:

center;padding-top:

30px;font-family:

Verdana,Arial,Helvetica,sans-serif;font-weight:

bold;}

.d2{width:

100%;height:

209px;overflow:

hidden;}

.num_list{position:

absolute;width:

100%;left:

0px;bottom:

-1px;background-color:

#000000;color:

#FFFFFF;font-size:

12px;padding:

4px0px;height:

20px;overflow:

hidden;}

.num_listspan{display:

inline-block;height:

16px;padding-left:

6px;}

img{border:

0px;}

ul{display:

none;}

.button{position:

absolute;z-index:

1000;right:

0px;bottom:

2px;font-size:

13px;font-weight:

bold;font-family:

Arial,Helvetica,sans-serif;}

.b1,.b2{background-color:

#666666;display:

block;float:

left;padding:

2px6px;margin-right:

3px;color:

#FFFFFF;text-decoration:

none;cursor:

pointer;}

.b2{color:

#FFCC33;backg

关于我们 - 网站声明 - 网站地图 - 资源地图 - 友情链接 - 网站客服 - 联系我们

经营许可证编号:鄂ICP备2022015515号-1

html5精妙代码.docx

星期一开始了

星期二怎么样呢？

听人说：

研究一下AJAX

明天就要解放了！

热门标签