您的位置:首页 > Web前端 > JavaScript

js实现翻牌效果

2015-05-20 14:25 267 查看
  <ul id="divlist" class="clearfix">

$("#divlist li").mouseenter(

         function (){

var num = $("div", this).attr("num");

if (num == undefined){

return;

}

var id = "div"+num;

var objDiv = $("div", this);

myTimer = setTimeout(function(){

if(eval("count"+num) == 1){

objDiv.animate({ width: "0px", left: "50px" }, 180);

objDiv.animate({ width: "150px", left: "25px" }, 180);

setHtml(num,objDiv.html());

//setColor(num,$("div", this).css('background-color'));

objDiv.html(fungunContent(getArray(id),num));

objDiv.css('text-align', "left");

setCount(num,0);

}

},400);

}

);

$("#divlist li").mouseleave(

function () {

clearTimeout(myTimer);

var num = $("div", this).attr("num");

if (num == undefined){

return;

}

var id = "div"+num;

if(eval("count"+num) == 0){

$("div", this).animate({ width: "0px", left: "50px" }, 180);

$("div", this).animate({ width: "150px", left: "25px" }, 180);

$("div", this).html(eval("html"+num));

//$("div", this).css('background', eval("color"+num));

$("div", this).css('text-align', "center");

setCount(num,1);

}

}

);

// 添加代办模块

function setUndoModule(){

var vMdlNum = 0;

var vUndoMdl = "<li><div id='div0' num='0'><h1 class='undoTitleNum'>25</h1><p><h3 class='undoTitleChinese'>测试1</h3></p></div></li>";

// 测试1

if($!doTaskCount != -1){

vUndoMdl += "<li><div id='div9' num='9'><h1 class='undoTitleNum'>48</h1><p><h3 class='undoTitleChinese'>测试2</h3></p></div></li>";

}

if ($!undoPlanCount != -1){

vUndoMdl += "<li><div id='div1' num='1'><h1 class='undoTitleNum'>36</h1><p><h3 class='undoTitleChinese'>测试3</h3></p></div></li>";

}

if ($!undoJobCount != -1){

    vUndoMdl += "<li><div id='div2' num='2'><h1  class='undoTitleNum'>12</h1><p><h3 class='undoTitleChinese'>测试4</h3></p></div></li>";

}

if ($!undoReceiveCount != -1){

vUndoMdl += "<li><div id='div3' num='3'><h1  class='undoTitleNum'>45</h1><p><h3  class='undoTitleChinese'>测试5</h3></p></div></li>";

}

if ($!undoFeedbackCount != -1){

vUndoMdl += "<li><div id='div4'  num='4'><h1  class='undoTitleNum'>34</h1><p><h3  class='undoTitleChinese'>测试6</h3></p></div></li>";

vUndoMdl += "<li><div id='div8'  num='8'><h1  class='undoTitleNum'>56</h1><p><h3  class='undoTitleChinese'>测试7</h3></p></div></li>";

}

if ($!undoAssessCount != -1){

vUndoMdl += "<li><div id='div5'  num='5'><h1  class='undoTitleNum'>12</h1><p><h3  class='undoTitleChinese'>测试8</h3></p></div></li>";

}

if($!undoFirstAuditCount != -1){

vUndoMdl += "<li><div id='div10'  num='10'><h1  class='undoTitleNum'>58</h1><p><h3  class='undoTitleChinese'>测试9</h3></p></div></li>";

}

vUndoMdl += "<li><div id='div6' num='6'><h1  class='undoTitleNum'>78</h1><p><h3  class='undoTitleChinese'>测试10</h3></p></div></li>";

//屏蔽收件箱

//vUndoMdl += "<li><div id='div7' ><h2  class='undoTitle'><a id='inbox1' class='undoa'  href='javascript:void(0);' onclick='openCcsBox(\"sbwp\",true);return false;'  target='ccsBox'>收件箱</a></h2>";

//vUndoMdl += "<p><h3  class='undoTitle'><a id='inbox' class='undoa'  href='javascript:void(0);' onclick='openCcsBox(\"sbwp\",true);return false;'  target='ccsBox'>0</a></h3></p></div></li>";

$("#divlist").html(vUndoMdl);

}

// div 翻滚

function fungunContent(array,num){

if (array == null || array == undefined){

return;

}

var content = "";

var iSum = 0;

//

if (num == '6'){

var vTSum = 0;

for(var i=0;i<array.length;i++){

vTSum += array[i].COUNT

}

content = "<p><h5 class='undoFont'><a class='undoa' href='javascript:undoLink(6,6)'>全部:"+vTSum+"</a></h5></p>";

content +="<p><h5 class='undoFont'><a class='undoa' href='javascript:undoLink(";

content += num;

content += ",6)'> 任务:";

content +=vTSum;

content += "</a></h5></p>";

return content;

}

for(var i=0;i<array.length;i++){

if (array[i].TASK_SOURCE == 1){

content +="<p><h5 class='undoFont'><a class='undoa' href='javascript:undoLink(";

content += num;

content += ",1)'> 测试1:";

content +=array[i].COUNT;

content += "</a></h5></p>";

}else if (array[i].TASK_SOURCE == 2){

content +="<p><h5 class='undoFont'><a class='undoa' href='javascript:undoLink(";

content += num;

content += ",2)'> CCS:";

content +=array[i].COUNT;

content += "</a></h5></p>";

}else if (array[i].TASK_SOURCE == 3){

content +="<p><h5 class='undoFont'><a class='undoa' href='javascript:undoLink(";

content += num;

9ff8

content += ",3)'> 测试2:";

content +=array[i].COUNT;

content += "</a></h5></p>";

}else if (array[i].TASK_SOURCE == 4){

content +="<p><h5 class='undoFont'><a class='undoa' href='javascript:undoLink(";

content += num;

content += ",4)'> 测试3:";

content +=array[i].COUNT;

content += "</a></h5></p>";

}

iSum+=array[i].COUNT;

}

return "<p><h5 class='undoFont'><a class='undoa' href='javascript:undoLink("+num+",0)'>全部:"+iSum

+"</a></h5></p>"+content;

}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jsp