06HUI - 底部导航及新消息提示组件（hui-footer-icons）

效果图

底部导航dom结构

    
        

        
首页
    
    
        

        
新闻
    
    

        
    
    
        

        
社区
    
    
        

        
我的
    

说明：底部导航内导航元素默认宽度为20%，可以调用图标库中的图片和自定义图标。

使用 hui(‘id选择器’).pointMsg() 函数实现新消息提醒

功能：新消息提醒 参数: 1、msg 消息内容（可选参数：数字或者文本，默认 false），说明：不设置参数或者false则展示一个红色点，设置数字则展示包含数字的圆点消息框，设置文本展示圆角消息框； 2、color 背景颜色，可省参数，默认值 #ED2D22； 3、size 消息文本字体大小，可省参数，默认值 8px； 4、top 顶部距离，可省参数，默认值 0px； 5、right 右侧距离，可省参数，默认值 8px； 返回值: 无 批量操作：不支持

代码

HUI - 底部导航




    

    HUI - 底部导航


    

        

        
底部导航演示
        

    
    

        说明 : 
        

            效果请见底部，您也可以使用首页的遮盖模式 ^_^
        
    


    
        

        
首页
    
    
        

        
新闻
    
    

        
    
    
        

        
社区
    
    
        

        
我的
    



hui('#nav-my').pointMsg();
hui('#nav-news').pointMsg('hot', null, null, null, '1px');
hui('#nav-forum').pointMsg(8);