页面抽屉效果

(function () {
$.fn.IngeniousDT = function (tableTitle) {
//判断应合并的行数
var tdColspan = $(this).find("tr").last().find("td").length;

$(this).before('<table class="db_tab"><thead><tr align="center"><td class="db_tab_l" colspan="' + tdColspan + '" style="text-align: left;"><div style="z-index:1000;vertical-align: middle; cursor: pointer;font-weight:bold;" isshow="true" ><img align="left" src="../../../../../Images/icon_unfold.gif" />  ' + tableTitle + '</div></td></tr></thead></table>');

// 操作的div对象
var divObjDo = $(this).prev("table[class=db_tab]").find("div");

//收缩拉伸的div对象
$(this).wrapAll("<div></div>");
var divObj = $(this).parent();
//获得收缩拉伸的div对象的高度
var divHeight = $(this).parent().height();

divObjDo.bind("click", function () {
if (divObjDo.attr("isshow") == "true") {
callbackFuncIngenious(divObj, divObjDo, "false", divHeight);
} else {
callbackFuncIngenious(divObj, divObjDo, "true", divHeight);
}
});
};


var callbackFuncIngenious = function (obj, objDo, isShow, divHeight) {
var phtName = "";
var opacityVal = "";

if (isShow == "false") {
divHeight = '-=' + divHeight + 'px';
phtName = "";
opacityVal = "0";
} else {
divHeight = '+=' + divHeight + 'px';
phtName = "un";
opacityVal = "1";
}

objDo.find("img").attr("src", "../../../../../Images/icon_" + phtName + "fold.gif");

objDo.attr("isshow", isShow);

obj.animate({ height: divHeight, opacity: opacityVal });
obj.find("> *").slideToggle();
};
})();

  

原文地址:https://www.cnblogs.com/zzq-include/p/4290099.html