位置: 编程技术 - 正文

jquery实现简单的遮罩层(jquery使用教程)

编辑:rootadmin

推荐整理分享jquery实现简单的遮罩层(jquery使用教程),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:jquery实战,jquery的实现原理,jquery简单例子,jquery实战,jquery怎么写,使用jquery实现的项目,jquery技巧,用jquery,内容如对您有帮助,希望把文章链接给更多的朋友!

本文实例讲解了jquery遮罩层,包括遮罩层的不同样式实现、mask实现遮罩层等,分享给大家供大家参考,具体内容如下

一、jQuery实现遮罩层的不同样式1.1 背景半透明遮罩层样式需要一个黑色(当然也可以其他)背景,且须设置为绝对定位,以下是项目中用到的css样式:

1.2 jQuery实现遮罩

1.3 提示框遮罩的目的无非让人无法操作内容,突出提示框,而提示框可参考上面的制作,z-index比遮罩层更高便可。主要问题是,如何控制提示框在浏览器居中。

jquery实现简单的遮罩层(jquery使用教程)

二、Jquery超简单遮罩层实现代码在开发中,为了避免二次提交,遮罩层的运用越来越普遍看了很多代码,下面跟大家分享一下我认为最简单的遮罩层实现方式:1.样式如下设置:CSS代码:

其中:opacity:0.5;适用于IE, -moz-opacit:0.5;适用于火狐;你只需要都加上,便可以火狐和IE下都可以使用。2.指定层的高度、和宽度js代码

3.在<body>中加入如下代码,然后就可以看到效果

html代码

4.使用方法在ajax提交表单后,加上showMask方法,数据返回后,加上hideMask()需要的亲们可以根据自己需求,在遮罩层上面加一些提示信息

三、发布个JQuery的遮罩层实现(mask)

用过ExtJs的可能知道在ExtJs中集成了很多的UI元素可以很方便我们的使用。其中有mask()和unmask()这两个方法,这两个方法在指定的元素上添加一个遮罩层和一个提示消息实现,增加客户体验。由于最近做项目的时候,发现有时为了使用这一两个方法需要引入一个比较“庞大”的Extjs进来,觉得有点不划算,于是自己用jquery实现了一个比较简单mask、unmask方法来实现该效果。大家知道jquery是一个优秀的javascript框架,不但体积小而且使用方便,我现在逐渐将系统中使用Extjs实现的代码或组建全部更换成Jquery来实现。好了不多说,上我的代码,这些代码是根据网上的一位朋友实现的documentMask基础上进行整改的,使用上更加灵活方便了。

下面是使用实例代码可供参考

标签: jquery使用教程

本文链接地址:https://www.jiuchutong.com/biancheng/384669.html 转载请保留说明!

上一篇:javascript多物体运动实现方法分析(js实现物体移动)

下一篇:javascript运动框架用法实例分析(实现放大与缩小效果)(js实现滑动效果)

  • 应付税费重分类如何做会计分录?
  • 利息收入需要缴纳企业所得税吗
  • 汇算清缴时房企毛利额有差异如何调整
  • 公司会计日常工作内容
  • 公司申请破产后股东需要还债吗
  • 退回以前年度的增值税账务处理
  • 员工向用人单位签加班协议书范本
  • 发票只有抵扣联没有发票联能不能报销
  • 股东向企业借款属于关联交易吗
  • 出售使用过的固定资产
  • 实习生应该如何计算个人所得税
  • 跨期发票可以申报抵扣进项税额吗?
  • 未开发票收入交增值税怎么做账?
  • 调财务报表怎样调整
  • 投资项目非股权比例
  • 房地产商品房销售营业税怎么算
  • 印花税是填开票金额吗
  • 广告业增值税税率6%是多少
  • 待认证进项税额借方余额表示什么
  • 互联网税务行动计划五大板块
  • 非公司员工可以交社保吗
  • 敏感资产额怎么算
  • 建立账套的简单操作
  • 如何查看本月还款金额
  • 税控盘额度
  • 购入低值易耗品一批,实际成本4000元
  • 高新企业奖励补贴交税吗
  • 公司买厨房用品计入什么科目
  • 什么是电力市场
  • 跟a签订合同可以撤销吗
  • 怎么用老毛桃u盘装win7系统 老毛桃u盘装win7系统教程图解
  • macOS Big Sur 11.2 RC 3(版本号20D64)预览版正式发布(附更新内容)
  • 深度学习和日常代码中遇到的报错汇总及解决方案,持续更新中。。。。
  • PHP:pcntl_signal_dispatch()的用法_PCNTL函数
  • 装饰工程施工包括什么
  • 二手房交易需缴哪些税
  • 格拉纳达的阿尔罕布拉宫用什么材料制成?
  • 考研408怎么样
  • 【AIGC】1、爆火的 AIGC 到底是什么 | 全面介绍
  • php取二维数组的一组内容
  • php验证表单方法有哪些
  • vue实例完整项目源码
  • php读取php文件内容
  • 产成品核算的内容
  • 公司购买承兑
  • 记账凭证的主要作用有
  • 企业产值用什么符号表示
  • 邮寄的发票对方没收到怎么办
  • 预提费用待摊费用改为什么科目
  • 印花税减半征收减免性质代码
  • ps高反差保留怎么弄
  • 织梦logo怎么更换
  • 收缩数据库日志文件对数据有影响吗
  • 货物运输发票的开票要求
  • 本月计提费用,发票下个月到可以吗
  • 支付的中介费进什么科目
  • 外币账户结汇至人民币账户
  • 建筑行业每月报税
  • 国有企业取得的土地建设职工住宅
  • 不良品扣款会计分录
  • 模具维修费用清单表格
  • 其他应付款的核算项目是什么
  • 幼儿园固定资产一览表
  • 数据结构 简书
  • ubuntu安装超详细教程
  • 怎样升级智慧中小学版本软件
  • win10默认edge浏览器
  • 更加有效率
  • js 数组 增加元素
  • html淘宝搜索框代码
  • vue路由跳转的钩子函数什么时候会用到
  • jQuery中ajax错误调试分析
  • jquery读写文件
  • jquery使用Cookie和JSON记录用户最近浏览历史
  • No active compatible AVD's or devices found. Relaunch this configuration after connecting a device o
  • 广东税务增值税发票查验平台
  • 税务 违法税收
  • 个人能拒绝公司上市吗
  • 有关单位和个人应该怎么样
  • 水费不用交吗
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设