html代码:
css代码:
/*角标 */ .ii{ display: none; background: #f00; border-radius: 50%; width: 20px; height: 20px; top: 5px; right: 0px; position: absolute; text-align: center; color: #FFF; z-index: 99999; }
js代码:
function ajaxa(){ $.ajax({ type:"POST", dataType : "json", async: false, url : "${pageContext.request.contextPath}/docinf/sendInform/lookForMsgNum.do", data : {}, success : function(data){ if(data !=null){ if(parseInt(data)>10){ $("#msgNum").show(); $("#msgNum").text(parseInt(data)); }else if(parseInt(data)> 0){ $("#msgNum").show(); $("#msgNum").text(parseInt(data)); }else{ $("#msgNum").hide(); } } }, error:function(){ } }); }
实现效果:
以上所述是小编给大家介绍的html在消息按钮上增加数量角标的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
网站类容多为转载,如有侵权,请联系站长删除
上一个:浅谈HTML的doctype和编码html5 canvas实现的流星雨星星动画背景特效源码浅谈script在html中的摆放位置HTML+CSS项目开发经验总结(推荐)前端之HTML知识点整理汇总(推荐)浅谈HTML中的标记html5实现的创意扭曲针时钟特效源码HTML5 Canvas逼真黑板写字特效源码HTML 文本格式化的简单实例(详解)
下一个:标签栏的几种实现方法(推荐)jQuery+ajax+html5+css3等最新技术整合的Tab标签栏切换特效DOMTab-通过CSS和DOMscripting进行tab标签栏切换效果基于JS的无比可爱tab标签栏切换效果的实现代码基于jQuery的简单的tab标签栏切换效果的实现代码