火龙果软件html5精妙代码.docx

上传人:b****2 文档编号:1230113 上传时间:2023-04-30 格式:DOCX 页数:17 大小:19.20KB
下载 相关 举报
火龙果软件html5精妙代码.docx_第1页
第1页 / 共17页
火龙果软件html5精妙代码.docx_第2页
第2页 / 共17页
火龙果软件html5精妙代码.docx_第3页
第3页 / 共17页
火龙果软件html5精妙代码.docx_第4页
第4页 / 共17页
火龙果软件html5精妙代码.docx_第5页
第5页 / 共17页
火龙果软件html5精妙代码.docx_第6页
第6页 / 共17页
火龙果软件html5精妙代码.docx_第7页
第7页 / 共17页
火龙果软件html5精妙代码.docx_第8页
第8页 / 共17页
火龙果软件html5精妙代码.docx_第9页
第9页 / 共17页
火龙果软件html5精妙代码.docx_第10页
第10页 / 共17页
火龙果软件html5精妙代码.docx_第11页
第11页 / 共17页
火龙果软件html5精妙代码.docx_第12页
第12页 / 共17页
火龙果软件html5精妙代码.docx_第13页
第13页 / 共17页
火龙果软件html5精妙代码.docx_第14页
第14页 / 共17页
火龙果软件html5精妙代码.docx_第15页
第15页 / 共17页
火龙果软件html5精妙代码.docx_第16页
第16页 / 共17页
火龙果软件html5精妙代码.docx_第17页
第17页 / 共17页
亲,该文档总共17页,全部预览完了,如果喜欢就下载吧!
下载资源
资源描述

火龙果软件html5精妙代码.docx

《火龙果软件html5精妙代码.docx》由会员分享,可在线阅读,更多相关《火龙果软件html5精妙代码.docx(17页珍藏版)》请在冰点文库上搜索。

火龙果软件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.

Copyright2009Yourname

.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;bac

展开阅读全文
相关资源
猜你喜欢
相关搜索
资源标签

当前位置:首页 > PPT模板 > 中国风

copyright@ 2008-2023 冰点文库 网站版权所有

经营许可证编号:鄂ICP备19020893号-2