jQuery可自动隐藏顶部消息提示框

 时间:2026-04-24 19:59:52

1、新建html文档。

jQuery可自动隐藏顶部消息提示框

2、书写hmtl代码。<div class="v" onclick="xcsoft.info('请填写你的相关信息哟',3000)"> 提示消息[3秒后自动消失] </div><div class="v" onclick="xcsoft.success('你的信息更新完毕',1500)"> 成功消息[1.5秒后自动消失] </div><div class="v" onclick="xcsoft.error('你还有信息未填写',2000)"> 失败消息[2秒后自动消失] </div><div class="v" onclick="xcsoft.loading('正在更新中,请等待...')"> 加载消息[不会自动消失] </div><div class="v" onclick="xcsoft._hide()"> 强制隐藏消息 </div>

jQuery可自动隐藏顶部消息提示框

3、书写css代码。<style>* { padding: 0; margin: 0 }div.v { width: 200px; margin: 0 auto; background: #060; color: #FFF; text-align: center; margin-top: 10px; padding: 10px; cursor: pointer }</style>

jQuery可自动隐藏顶部消息提示框

4、书写并添加js代码。<script src="js/jquery.min.js"></script><script src="js/jquery.xctips.js"></script><script>//为 tips 提示框自定义 CSS,以下为默认xcsoft.tipsCss = {    height: '44px',    fontSize: '16px'};//隐藏、显示速度 ,默认 fastxcsoft.tipsHide=xcsoft.tipsShow=100;</script>

jQuery可自动隐藏顶部消息提示框

5、代码整体结构。

jQuery可自动隐藏顶部消息提示框

6、查看效果。

jQuery可自动隐藏顶部消息提示框

  • excel2019怎样给表格添加边框
  • 如何判断页面是否加载完毕
  • 如何看一个节点和队列
  • PHP如何为一个配置选项设置值?ini_set函数使用
  • word如何设置限制编辑?如何限制word编辑?
  • 热门搜索
    狼牙山旅游 痰湿体质如何调理 如何申请微信 员工评价怎么写 东风雪铁龙怎么样 怎么进入路由器设置界面 九寨沟在哪里 如何写情书 怎么修改群名片 如何寻找客户