• 手风琴效果简单实现,修改bootstrap内部事件接口并且自由定义。


    以下均为本人原创,转载请说明出处!

    {

    // 内层DIV手风琴打开关闭事件共通处理(评价得分和要点)
    var subHeadDivIDFst = "#head_d1_" + clickDivID;
    var subShowDivIDFst = "#collapse_d1_" + clickDivID;
    $(subHeadDivIDFst).click(function() {
    doSubDivOpenClose(subHeadDivIDFst, subShowDivIDFst);
    });
    // 内层DIV手风琴打开关闭事件共通处理(相关说明)
    var subHeadDivIDSnd = "#head_d2_" + clickDivID;
    var subShowDivIDSnd = "#collapse_d2_" + clickDivID;
    $(subHeadDivIDSnd).click(function() {
    doSubDivOpenClose(subHeadDivIDSnd, subShowDivIDSnd);
    });
    // 内层DIV手风琴打开关闭事件共通处理(证明材料)
    var subHeadDivIDTrd = "#head_d3_" + clickDivID;
    var subShowDivIDTrd = "#collapse_d3_" + clickDivID;
    $(subHeadDivIDTrd).click(function() {
    doSubDivOpenClose(subHeadDivIDTrd, subShowDivIDTrd);
    });

    }

    /* 内层DIV手风琴打开关闭事件共通处理 */
    function doSubDivOpenClose(subHeadDivID, subShowDivID) {

    // 控制DIV样式设定
    var spanInDiv = $(subHeadDivID).find("span:first");

    if (spanInDiv.prop("class").indexOf("pull-left glyphicon glyphicon-chevron-right") >= 0) {
    // 展开DIV
    $(subShowDivID).slideDown(300);
    spanInDiv.prop("class","pull-left glyphicon glyphicon-chevron-down");
    } else{
    // 折叠DIV
    $(subShowDivID).slideUp(300);
    $(spanInDiv).prop("class","pull-left glyphicon glyphicon-chevron-right");
    }
    }

  • 相关阅读:
    C# 动态加载控件 (转)
    SQL 周月时间段
    js调用xml数据显示div层上下滚动的公告
    使用半透明的DIV实现禁用页面功能(转)
    学习jQuery第一天"Hello!How are you!"
    HTML生成类
    从无限畅想转来的
    SQL递归查询子类型
    js 图片缩显
    2020年统计用区划代码和城乡划分代码:安徽省乡镇编码
  • 原文地址:https://www.cnblogs.com/weijieyun/p/6050501.html
Copyright © 2020-2023  润新知