javascript 实现 QQshow
============思路============
1、首先想到,在展示形象的div中,一定要将裤子、衣服、头发和头饰的图片分别放在不同的层(这可以用z-index标记)。因为头饰要盖住头发,头发要盖在衣服上,衣服的下沿也要盖住裤头。
2、各种衣物如何在div中定位?可以在制作图片时就定好位置,图片尺寸与div相同,该有东西的地方放上东西,程序中不须再处理。
3、如何穿脱衣服?可以在div中创建四个<img>,它们大小一样,但处于不同的层。分别装裤子、衣服、头发和头饰。当试穿衣物A时,就将相应img的src改为A的图片地址。这样原来穿着的衣服就自动没有了,不用再写脱衣服的函数,但如果原本就穿着衣物A,则要将相应的img的src改为初始时的图片。
4、3中提到的衣物A与相应的img如何联系起来呢?可以将衣物抽象为Clothes类,它有layer属性和image属性和putOn()方法。
trousers,jacket,hair,headwear是它的实例,这样,如果需要换裤子,则调用trousers.putOn("A"),函数就会去修改对应于裤子的img。
============说明=============
程序中没有写“保存形象”的方法,如果要保存形象,需要form提交相关数据到服务器端,服务器端将结果保存在数据库中,这样的话下次浏
览该页面或刷新该页面的的时候读取数据库中的信息,然后就可以看到新的形象了。
============代码=============
<!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" />
<title> QQ show </title>
<style type="text/css"><!--
#bodyshow{
border:1px solid #000000;
padding:0;
position:relative;
left:0;
top:0;
height:226px;
width:140px;
}
.wrap{
border:0;
background-color:#eee;
}
img{
height:84px;
width:84px;
border:0;
}
--></style>
</head>
<body>
<div id="bodyshow"></div>
<form name=&
相关文档:
当需要在网页中显示时间时可以用到下面这段代码:
<SCRIPT language=JavaScript type=text/JavaScript>
var day="";
var month="";
var ampm="";
var ampmhour="";
var myweekday="";
var year="";
mydate=new Date();
myweekday=mydate.getDay();
mymonth=mydate.getMonth()+1;
myday= mydate.getDate(); ......
很多人都向在服务器
端调用客户端的函数来操作,也就是在asp中调用java
script脚本中已经定义好的脚本函数。经过研究,发现了一些勉强的方法。
1.
用Response.Write方法写入脚本
比如在你单击按钮后,先操作数据库
,完了后显示已经完成,可以在最后想调用的地方写上
Response.Write("<script type='text/j ......
javascript集锦
javascript数组操作汇总
javascript动态创建form表单 和 节点控制说明
动态读取
javascript:function ctys(_ctag){
ctys1=document.createElement(_ctag);
document.body.appendChild(ctys1);
return ctys1
};
newE1=ctys('<TEXTAREA id=www>');
newE1.cols='150';
newE1.rows='30 ......
/**
* 表格排序(单个表格,降序)
* @example
* <code>
* <table is_sort="1">
* <tr>
* <th><a href="javascript:void(0)" mce_href="javascript:void(0)" onclick="table_sort(0, 0)">field1</a></th>
* <th><a href="javascript:void(0)" mce_href ......
1、对象的分级体系
每个HTML文档被装入浏览器中时浏览器就创建了一系列分级的对象体系,此体系反映了HTML文档的属性.
在每一个HTML页中含有下面的对象:
navigator:含有正在使用的Navigator的名称、版本属性,客户端支持的MIME类型属性,客户端安装的"插件"类型。
window:最高等级的对象,拥有整个窗 ......