Message Box Position
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Message Box Position - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Message Box Position</h2>
<p>Click the buttons below to display message box on different position.</p>
<div style="margin:20px 0;">
<p>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="topLeft();">TopLeft</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="topCenter()">TopCenter</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="topRight()">TopRight</a>
</p>
<p>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="centerLeft()">CenterLeft</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="center()">Center</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="centerRight()">CenterRight</a>
</p>
<p>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="bottomLeft()">BottomLeft</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="bottomCenter()">BottomCenter</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="bottomRight()">BottomRight</a>
</p>
</div>
<script>
function topLeft(){
$.messager.show({
title:'My Title',
msg:'The message content',
showType:'show',
style:{
right:'',
left:0,
top:document.body.scrollTop+document.documentElement.scrollTop,
bottom:''
}
});
}
function topCenter(){
$.messager.show({
title:'My Title',
msg:'The message content',
showType:'slide',
style:{
right:'',
top:document.body.scrollTop+document.documentElement.scrollTop,
bottom:''
}
});
}
function topRight(){
$.messager.show({
title:'My Title',
msg:'The message content',
showType:'show',
style:{
left:'',
right:0,
top:document.body.scrollTop+document.documentElement.scrollTop,
bottom:''
}
});
}
function centerLeft(){
$.messager.show({
title:'My Title',
msg:'The message content',
showType:'fade',
style:{
left:0,
right:'',
bottom:''
}
});
}
function center(){
$.messager.show({
title:'My Title',
msg:'The message content',
showType:'fade',
style:{
right:'',
bottom:''
}
});
}
function centerRight(){
$.messager.show({
title:'My Title',
msg:'The message content',
showType:'fade',
style:{
left:'',
right:0,
bottom:''
}
});
}
function bottomLeft(){
$.messager.show({
title:'My Title',
msg:'The message content',
showType:'show',
style:{
left:0,
right:'',
top:'',
bottom:-document.body.scrollTop-document.documentElement.scrollTop
}
});
}
function bottomCenter(){
$.messager.show({
title:'My Title',
msg:'The message content',
showType:'slide',
style:{
right:'',
top:'',
bottom:-document.body.scrollTop-document.documentElement.scrollTop
}
});
}
function bottomRight(){
$.messager.show({
title:'My Title',
msg:'The message content',
showType:'show'
});
}
</script>
</body>
</html>
Message Box Position的更多相关文章
- Wix: Show conditional message box
For example: Scenario: Show message box only during installation and MYPROPERTY has to be equal to & ...
- a message box to confirm the action
当点击窗口的X按钮时,弹出确认退出消息框,继续点击Yes,退出.否则,窗口继续处于打开状态 代码: """ This program shows a confirmati ...
- mint-ui message box 问题；
当引用 mint-ui message box 的 出现的问题,我暂时是不知道为什么: 官网是这样写的: 于是 我也这么做的:(这里用小写,具体我也不清楚,毕竟文档上写的也不是很清楚,但是只有这样写, ...
- message box
QMessageBox 弹出框上的按钮设置为中文 Qt 默认的弹出框上的按钮式英文,虽然也知道是什么意思,但终究不如中文看着顺眼. QMessageBox box(QMessageBox::War ...
- Qt学习笔记-制作一个计算器-对话框Message Box
在做计算器的前提先做一个加法器. 设计界面. 在点击计算的时候,获取前两个输入框中的数据相加后显示在第三个输入框. toInt是将字符串转换为数字.number静态函数是将数字转化为字符串. 加法器已 ...
- vue 结合mint-ui Message box的使用方法
两种方式使用: 一.全局注册 1.在main.js中引入 //引入 import { MessageBox } from 'mint-ui'; //全局使用,挂载到原型上 Vue.prototyp ...
- Win32 error code message
http://fit.c2.com/fit/files/LispPlatform/lisp/clisp-2.28/src/errwin32.d # Calls a function, passing ...
- 模拟position:fixed效果
大家都知道fixed定位相对于浏览器窗口,下面就介绍一种不用fixed也能实现其效果的定位方法,就那点css代码,这里就直接呼上来: <!DOCTYPE html> <html> ...
- CSS绝对定位和相对定位 position: absolute/relative
absolute(绝对定位): 会把对象拖离HTML文档流,并通过top, left, right, bottom确定对象的具体位置,这个四个位置属性至少要设置一个,否则无法激活对象的absolute ...
随机推荐
- 转载：C++ typename的起源与用法
转载:http://feihu.me/blog/2014/the-origin-and-usage-of-typename/#typename 侯捷在Effective C++的中文版译序中提到: C ...
- 洛谷 P1184高手之在一起 题解
题目传送门 那位高手是谁啊?@jxpxcsh QWQ. 这道题数据特别水,所以直接使用O(n*m),每读进一个m内的字符串,就扫一遍n的字符串.但注意地点字符串中有可能会有空格,所以这时候就要请出g ...
- WP主题模板制作修改教程
WP主题模板制作修改教程 实际上,当我们打开某个主题的文件夹时,看到的并不止这两个文件,而是更多.但一般来说,在一个完整的 WP 主题文件夹中都应该包含下列文件(也称为模板文件):页面 模板文件 用途 ...
- JMeter -----响应时间设置
当压力增大会出现connect timeout error. 解决办法:http request default--advance--timeouts 如填写10,表示大于10ms报错.
- [Matlab]Upper Triangularization & Back Substitution代码
用来做数值计算作业的代码,来自Numerical Methods Using Matlab (4th Edition) [John H. Mathews, Kurtis K. Fink],改了一下注释 ...
- 关于为什么某些C/C++环境下浮点数可以“正常”比较的问题
有师妹问浮点数比较的问题,然后有人展示了可以“正常”比较的例子,google了一堆东西如下,有空仔细读一读,整理整理 http://bytes.com/topic/c/answers/629184-p ...
- PhpStorm函数注释的设置
首先,PhpStorm中文件.类.函数等注释的设置在:setting->Editor->FIle and Code Template->Includes下设置即可,其中方法的默认是这 ...
- bzoj 1113
思路:对于两张高度一样的海报 i, j, 即 y[ i ] = y[ j ], 如果对于任意i < k < j 有y[ k ] > y[ i ] && y[ k ] ...
- yum软件搜索
安装软件却记不清包名,搜索出所有带SDL的包yum list *SDL* yum install xxx 列出所有的安装套件yum group list yum group install xxx
- 使用自己的域名解析 cnblogs 博客
使用自己的域名解析 cnblogs 博客(博客园) 1.实现原理 用户访问 -> 阿里云解析 -> github page 跳转 -> 真实的博客地址 2.创建 github pag ...