各位大神，高手们，小弟又遇到难题了/这个展开特效如何实现
日期：2014-05-16 浏览次数：20587 次
各位大神，高手们，小弟又遇到难题了/这个展开特效怎么实现
各位大神，高手们，小弟又遇到难题了，
我要做一个展开带动画效果的，我的方法是$("id").show();
单独用这一个是好用的，但是要是多个一起用就不行了，
比如：onload=function(){
$("id_1").show();//这个会好用
$("id_2").show();//这个就没有反应了
}
求高手大神们指点！！！！！.......
以下为我的代码：有点乱。。。
function $(id){
var me = document.getElementById(id);
me.show=function(){
if((me.style.height=="" || me.style.height=="0px") && me.clientHeight == 0 && intervalId == "undefined"){
intervalId=setInterval(timeExecOpen(me,slow),1);
}else{return}
};
return me;
}
//timer
var intervalId = "undefined";
var timeIndex = 0,tn = 0,h = 0;
var timeEntityArray = new Array();
//收缩盒子
function timeExecClose(entity,speed){
if(timeIndex==0){
h = entity.clientHeight;
timeEntityArray.push(new Map(entity,h));
timeIndex++;
}
h<speed?h=0:h -=speed;
entity.style.height = h+"px";
entity.style.overflow = "hidden";
if(h<=0){
timeIndex=0; tn = 0; h = 0;
stopTime();
entity.style.display="none";
}
return function(){
timeExecClose(entity,speed);
}
}
//展开盒子
function timeExecOpen(entity,speed){
if(timeIndex==0){
entity.style.display="block";
if(timeEntityArray.length>0&&timeEntityArray!=null){
for(var i=0;i<timeEntityArray.length;i++){
if(timeEntityArray[i].key==entity){
h = timeEntityArray[i].value;
timeEntityArray.splice(i,1);//查到后删除临时对象
}
}
}else{
h=entity.clientHeight;
}
timeIndex++;
}
(tn+=speed)>h?tn=h:"";
entity.style.height = tn+"px";
entity.style.overflow = "hidden";
if(tn>=h){
timeIndex=0; tn = 0; h = 0;
stopTime();
}
return function(){
timeExecOpen(entity,speed);
}
}
//停止动画
function stopTime(){
window.clearInterval(intervalId);
intervalId = "undefined";
}
//定义一个MAP对象
function Map(key,value){
this.key = key;
this.value = value;
}
------解决方案--------------------
你想要的是这样?
各位大神，高手们，小弟又遇到难题了，
我要做一个展开带动画效果的，我的方法是$("id").show();
单独用这一个是好用的，但是要是多个一起用就不行了，
比如：onload=function(){
$("id_1").show();//这个会好用
$("id_2").show();//这个就没有反应了
}
求高手大神们指点！！！！！.......
以下为我的代码：有点乱。。。
function $(id){
var me = document.getElementById(id);
me.show=function(){
if((me.style.height=="" || me.style.height=="0px") && me.clientHeight == 0 && intervalId == "undefined"){
intervalId=setInterval(timeExecOpen(me,slow),1);
}else{return}
};
return me;
}
//timer
var intervalId = "undefined";
var timeIndex = 0,tn = 0,h = 0;
var timeEntityArray = new Array();
//收缩盒子
function timeExecClose(entity,speed){
if(timeIndex==0){
h = entity.clientHeight;
timeEntityArray.push(new Map(entity,h));
timeIndex++;
}
h<speed?h=0:h -=speed;
entity.style.height = h+"px";
entity.style.overflow = "hidden";
if(h<=0){
timeIndex=0; tn = 0; h = 0;
stopTime();
entity.style.display="none";
}
return function(){
timeExecClose(entity,speed);
}
}
//展开盒子
function timeExecOpen(entity,speed){
if(timeIndex==0){
entity.style.display="block";
if(timeEntityArray.length>0&&timeEntityArray!=null){
for(var i=0;i<timeEntityArray.length;i++){
if(timeEntityArray[i].key==entity){
h = timeEntityArray[i].value;
timeEntityArray.splice(i,1);//查到后删除临时对象
}
}
}else{
h=entity.clientHeight;
}
timeIndex++;
}
(tn+=speed)>h?tn=h:"";
entity.style.height = tn+"px";
entity.style.overflow = "hidden";
if(tn>=h){
timeIndex=0; tn = 0; h = 0;
stopTime();
}
return function(){
timeExecOpen(entity,speed);
}
}
//停止动画
function stopTime(){
window.clearInterval(intervalId);
intervalId = "undefined";
}
//定义一个MAP对象
function Map(key,value){
this.key = key;
this.value = value;
}
------解决方案--------------------
你想要的是这样?
- JScript code
<!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>无标题文档</title>
<script type="text/javascript">
var slow = 4, normal = 5, fast = 10;//动画特效速度级别
function $(id) {
var me = document.getElementById(id);
me.show = function() {
if (me.clientHeight == 0 && !me.intervalId) {
me.intervalId = setInterval(timeExecOpen(me, slow), 1);
} else {
return
}
};
me.hide = function() {
if (((me.style.height != "" && me.style.height != "0px") || me.clientHeight > 0)
&& !me.intervalId) {
me.intervalId = setInterval(timeExecClose(me, slow), 1);
} else {
return
}
};
return me;
}
/*************************************************************
* Timer 动画计时器特效 *
*********************************************************/
//var intervalId = "undefined";
var height = 300;
var timeIndex = 0, tn = 0, h = 0;
var timeEntityArray = new Array();
//收缩盒子
function timeExecClose(entity, speed) {
if
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
