responsive-overlay-menu跨浏览器覆盖菜单框架

联合创作 · 2023-10-02 16:33

responsive-overlay-menu 是一个响应跨浏览器覆盖菜单的框架。

特点:

  • 可在所有浏览器工作

  • 可在所有设备上工作

  • 够小

  • 超快

  • 使用 jQuery 动画

  • 免费使用(MIT 许可证)

示例代码:

.menu-btn {
    position: absolute;
    top: 6px;
    right: 20px;
    z-index: 999;
    display: inline;
    font-size: 32px;
}

.menu-btn a {
    display: inline-block;
    text-decoration: none;
    /* safari hack */
}

.btn-open:after {
    color: #333;
    content: "\f394";
    font-family: "Ionicons";
    -webkit-transition: all .2s linear 0s;
    -moz-transition: all .2s linear 0s;
    -o-transition: all .2s linear 0s;
    transition-property: all .2s linear 0s;
}

.btn-open:hover:after {
    color: #34B484;
}

.btn-close:after {
    color: #fff;
    content: "\f2d7";
    font-family: "Ionicons";
    -webkit-transition: all .2s linear 0s;
    -moz-transition: all .2s linear 0s;
    -o-transition: all .2s linear 0s;
    transition-property: all .2s linear 0s;
}

.btn-close:hover:after {
    color: #34B484;
}
浏览 6
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报