关于Layer web弹层组件的加载(loading)层位置居中问题

简介: 关于Layer web弹层组件的加载(loading)层位置居中问题

最近在项目中一直使用layerui的相应的提示框以及它的加载层,然而就在今天遇到了一个神奇的问题,我使用

var index = layer.load(0, {shade: false}); 结果一直偏左无法居中,也不知道什么原因,然后自己给它设置居中

offset设置top和left的偏移位置

layer.load(0,{
offset: ['50%', "50%"], shade: false
});
或者是:
var width = document.body.offsetWidth;
var wdithpx = (width / 2 - 37 / 2);
var index = layer.load(1, {
offset: ['50%', wdithpx], shade:false
});

最后想推荐大家可以了解下layui这个开箱即用的前端Web框架,对于我们这些后端开发而言这真的是福音,并且并且样式也比较的大气美观(说明:没有打广告的意思,只是认为真的比较适合我们这些后端人员)。

Layer Web弹出层组件地址:https://layer.layui.com/

Layui前端框架地址:https://www.layui.com/

相关文章
|
6月前
|
缓存 数据库 索引
如何优化Python Web应用的性能,包括静态资源加载、缓存策略等?
```markdown 提升Python Web应用性能的关键点:压缩合并静态资源,使用CDN,设置缓存头;应用和HTTP缓存,ETag配合If-None-Match;优化数据库索引和查询,利用数据库缓存;性能分析优化代码,避免冗余计算,使用异步处理;选择合适Web服务器并调整参数;部署负载均衡器进行横向扩展。每一步都影响整体性能,需按需调整。 ```
54 4
|
6月前
|
消息中间件 druid Java
web后端-SpringCloud-Bus消息总线组件
web后端-SpringCloud-Bus消息总线组件
|
3月前
|
JavaScript 前端开发 开发者
哇塞!Vue.js 与 Web Components 携手,掀起前端组件复用风暴,震撼你的开发世界!
【8月更文挑战第30天】这段内容介绍了Vue.js和Web Components在前端开发中的优势及二者结合的可能性。Vue.js提供高效简洁的组件化开发,单个组件包含模板、脚本和样式,方便构建复杂用户界面。Web Components作为新兴技术标准,利用自定义元素、Shadow DOM等技术创建封装性强的自定义HTML元素,实现跨框架复用。结合二者,不仅增强了Web Components的逻辑和交互功能,还实现了Vue.js组件在不同框架中的复用,提高了开发效率和可维护性。未来前端开发中,这种结合将大有可为。
142 0
|
3月前
|
Web App开发 JavaScript 前端开发
[译] 用 Web Worker 改善 Vue 组件性能
[译] 用 Web Worker 改善 Vue 组件性能
|
4月前
|
JavaScript 前端开发 UED
使用Layer和Toastr提升Web应用的用户交互体验
【7月更文挑战第7天】在现代Web应用开发中,提供友好且直观的用户反馈是提升用户体验的关键。Layer和Toastr是两个广泛使用的JavaScript库,它们可以帮助开发者轻松地在网页上实现弹窗提示和通知功能,增强用户交互体验。
69 3
|
17天前
|
前端开发 JavaScript 开发者
Web组件:一种新的前端开发范式
【10月更文挑战第9天】Web组件:一种新的前端开发范式
17 2
|
1天前
|
消息中间件 监控 Kafka
Apache Kafka 成为处理实时数据流的关键组件。Kafka Manager 提供了一个简洁的 Web 界面
随着大数据技术的发展,Apache Kafka 成为处理实时数据流的关键组件。Kafka Manager 提供了一个简洁的 Web 界面,方便管理和监控 Kafka 集群。本文详细介绍了 Kafka Manager 的部署步骤和基本使用方法,包括配置文件的修改、启动命令、API 示例代码等,帮助你快速上手并有效管理 Kafka 集群。
7 0
|
25天前
|
前端开发 JavaScript Go
前端开发趋势:从响应式设计到Web组件的探索
【10月更文挑战第1天】前端开发趋势:从响应式设计到Web组件的探索
29 3
|
6月前
|
缓存 前端开发 JavaScript
使用Web前端性能优化提高网站加载效率
前端性能优化关键在于提高用户体验和降低资源消耗,Webpack是重要工具。基础优化策略包括减少HTTP请求、资源压缩与缓存、异步加载。Webpack优化配置涉及Tree Shaking、代码分割。高级策略涵盖Long-term Caching、缓存提升和插件优化。打包部署时,自动化流程和环境管理也至关重要。通过这些方法,可提升Web应用速度和体验。
184 0
|
3月前
|
缓存 编解码 前端开发
优化Web应用性能的前端技巧:从加载时间到用户体验
在现代Web开发中,提升前端性能不仅仅是为了缩短页面加载时间,更是为了提供更流畅的用户体验。本文将探讨几种有效的前端优化技术,包括懒加载、代码拆分、资源压缩以及浏览器缓存策略。通过具体实例和最佳实践,读者将能够掌握如何系统地提高Web应用的响应速度,减少资源消耗,并最终改善用户的整体体验。