关于 jquery.showLoading 中 出现的 图标不在页面中间的问题
很多人喜欢 showLoading 因为 这个实在是太简单了直接
showLoading()
hideLoading()
就可以解决这个问题。
今天我们就来看一下 这个插件里面的一个错误
或者说是一个不人性化的地方
对于 showLoading() 中
hPos 和Vpos 默认的都是 center
找到 center X轴
jQuery(loadingDiv).css('left', (indicatorLeft + ((jQuery(overlayDiv).width() - parseInt(jQuery(loadingDiv).width())) / 2)).toString() + 'px');
这个是没有问题的
但是Y轴写成这样就有问题了
jQuery(loadingDiv).css('top', (indicatorTop + (($(overlayDiv).height() - parseInt(jQuery(overlayDiv).height())) / 2)).toString() + 'px');
写成这种情况下 , 在竖直方向对应的中心是 overlayDiv 的高度。
这个高度是 这个页面的高度(如果有滚动条 ,也包含带滚动条的高度)。
所以出现的图片 loading .gif 就不会在页面的正中央。简单修改一下
jQuery(loadingDiv).css('top', (indicatorTop + (($(window).height() - parseInt(jQuery(loadingDiv).height())) / 2)).toString() + 'px');
改成当前窗口的高度。
关于 jquery.showLoading 中 出现的 图标不在页面中间的问题的更多相关文章
- JQuery mobile中按钮自定义属性的改变
1..ui-mobile-viewport是jquery mobile默认给body加的class,这样的话包含选择符优先级高一点 <style> .ui-mobile-viewport ...
- JQuery EasyUI中datagrid的使用
在学习过程中,可以参照JQuery EasyUI的官方网站学习.地址:http://www.jeasyui.com/demo/main/index.php 在学习JQuery EasyUI中的Data ...
- Jquery EasyUI中treegrid
Jquery EasyUI中treegrid的中右键菜单和一般按钮同时绑定事件时的怪异事件 InChatter系统开源聊天模块前奏曲 最近在研究WCF,又因为工作中的项目需要,要为现有的系统增加一 ...
- 用字体在网页中画Icon图标
第一步,下载.IcoMoon网站选择字体图标并下载,解压后将fonts文件夹放在工程目录下.fonts文件夹内有四种格式的字体文件: 注:由于浏览器对每种字体的支持程度不一致,要想在所有浏览器中都显示 ...
- jQuery插件中的this指的是什么
在jQuery插件的范围里, this关键字代表了这个插件将要执行的jQuery对象, 但是在其他包含callback的jQuery函数中,this关键字代表了原生的DOM元素.这常常会导致开发者误将 ...
- 详解jquery插件中;(function ( $, window, document, undefined )的作用
在jquery插件中我们经常看到以下这段代码 1 2 3 ;(function ( $, window, document, undefined ){ //函数体内具体代码 })(jQuery, wi ...
- 网页中多个图标在一张图片上,使用css将各图标显示
现在的网页中显示很多图标算是常态,发现项目中页面上用到的图标都是单个图标单个文件,用的时候直接往页面上挂,这确实很常态. 如果,网站是挂在外网上,或者网速过低,又大量使用图标的情况下,由于浏览器和服务 ...
- 字体在网页中画ICON图标
用字体在网页中画ICON图标有三种小技巧: 1.用CSS Sprite在网页中画小图标 实现方法: 首先将小图片整合到一张大的图片上 然后根据具体图标在大图上的位置,给背景定位.background- ...
- 直接在 CSS 中引用 FONTAWESOME 图标(附码表)
直接在 CSS 中引用 FONTAWESOME 图标(附码表) 因此我们如果不想用 Fontawesome 提供的类,只想在 css 里面引用图标的话,可以这样子,请自行脑补: .icon:befor ...
随机推荐
- [AngularJS] angular-formly: Default Options
angular-formly allows you to keep your forms as DRY as possible. TheoptionsTypes property is one way ...
- Map的遍历方式
public class Mapper { public static void main(String[] args) { Map<String, String> map = new ...
- “DBUtility.DbHelperSQL”的类型初始值设定项引发异常 “DBUtility.DbHelperSQL”的类型初始值设定项引发异常
今天遇到了一个这样的问题“DBUtility.DbHelperSQL”的类型初始值设定项引发异常“DBUtility.DbHelperSQL”的类型初始值设定项引发异常 也许有和我遇到这问题的人也在这 ...
- 【转】企业级Java应用最重要的4个性能指标
应用性能管理(APM)是一种即时监控以实现对应用程序性能管理和故障管理的系统化解决方案.目前主要指对企业的关键业务应用进行监测.优化,最终达到提高企业应用的可靠性和质量,保证用户得到良好的服务,降低I ...
- 使用 Date 和 SimpleDateFormat 类表示时间
在程序开发中,经常需要处理日期和时间的相关数据,此时我们可以使用 java.util 包中的Date类.这个类最主要的作用就是获取当前时间,我们来看下Date的类的使用: Date d=new Dat ...
- 你不知道的javascript 上卷 读书笔记
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 整理SVN代码-->正式环境的代码
最近我被分配到了合并正式补丁代码的工作.聊聊整个流程 第一步解压补丁
- 多个线程访问url
多个线程访问url package com.aig.ecompassios.ecard; import java.io.BufferedReader; import java.io.InputStre ...
- linux yum配置
yum源模版 vi /etc/yum.repos.d/xxx.repo [rhel-server]name=serverbaseurl=file:///media/disk/Serverenabled ...
- UiTextField对输入的长度进行限制并提示用户还可输入的长度
最近想做用户昵称的限制,但是网上百度了很多方法效果都不是我自己想要的,终于找到种方法 如下: 1.声明两个属性 nickname是昵称的textfleld canEditSizeLAbel是提示用户剩 ...