onclick="sAlert('${vo.courseName}');"

<script type="text/javascript" language="javascript">
function getScroll() {
var top, left, width, height;
if (document.documentElement && document.documentElement.scrollTop) {
top = document.documentElement.scrollTop;
left = document.documentElement.scrollLeft;
width = document.documentElement.scrollWidth;
height = document.documentElement.scrollHeight;
}
else if (document.body) {
top = document.body.scrollTop;
left = document.body.scrollLeft;
width = document.body.scrollWidth;
height = document.body.scrollHeight;
}
return { top: top, left: left, width: width, height: height };
}
function scall(){
var v = getScroll();
var bgDiv = document.getElementById("bgDiv");
var msgDiv = document.getElementById("msgDiv");
var msgTitle = document.getElementById("msgTitle");
if(bgDiv != null){

bgDiv.style.top = ((v.top) + 0) + "px";
}
if(msgDiv != null){ //重新设置滚动条的位置
msgDiv.style.left = "50%";
msgDiv.style.top = "50%";
msgDiv.style.font="12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";
msgDiv.style.marginLeft = "-225px" ;
msgDiv.style.marginTop = (-75+(v.top))+"px";
}
if(msgTitle != null){
msgTitle.style.top = ((v.top) + 50) + "px";
}
}
window.onload = scall ;
window.onscroll = scall ;
</script>

<script type="text/javascript" language="javascript">
function sAlert(str){
var top = document.body.scrollTop;//得到滚动条的高度
var msgw,msgh,bordercolor;
msgw=500;//提示窗口的宽度
msgh=300;//提示窗口的高度
titleheight=25 //提示窗口标题高度
bordercolor="#336699";//提示窗口的边框颜色
titlecolor="#99CCFF";//提示窗口的标题颜色

var sWidth,sHeight;
sWidth=document.body.offsetWidth;
sHeight=screen.height;
var bgObj=document.createElement("div");
bgObj.setAttribute('id','bgDiv');
bgObj.style.position="absolute";
bgObj.style.top="0";
bgObj.style.background="#777";
bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
bgObj.style.opacity="0.6";
bgObj.style.left="0";
bgObj.style.width=sWidth + "px";
bgObj.style.height=sHeight + "px";
bgObj.style.zIndex = "10000";
document.body.appendChild(bgObj);

var msgObj=document.createElement("div");

msgObj.setAttribute("id","msgDiv");
msgObj.setAttribute("align","center");
msgObj.style.background="white";
msgObj.style.border="1px solid " + bordercolor;
msgObj.style.position = "absolute"; //设置第一次点击时消息框的位置
msgObj.style.left = "50%";
msgObj.style.top = "50%";
msgObj.style.font="12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";
msgObj.style.marginLeft = "-225px" ;
msgObj.style.marginTop = -75+top+"px";
msgObj.style.width = msgw + "px";
msgObj.style.height =msgh + "px";
msgObj.style.textAlign = "center";
msgObj.style.lineHeight ="25px";
msgObj.style.zIndex = "10001";

var title=document.createElement("h4");
title.setAttribute("id","msgTitle");
title.setAttribute("align","right");
title.style.margin="0";
title.style.padding="3px";
title.style.background=bordercolor;
title.style.filter="progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";
title.style.opacity="0.75";
title.style.border="1px solid " + bordercolor;
title.style.height="18px";
title.style.font="12px Verdana, Geneva, Arial, Helvetica, sans-serif";
title.style.color="white";
title.style.cursor="pointer";
title.innerHTML="关闭";
title.onclick=function(){
document.body.removeChild(bgObj);
document.getElementById("msgDiv").removeChild(title);
document.body.removeChild(msgObj);
}
document.body.appendChild(msgObj);
document.getElementById("msgDiv").appendChild(title);
var txt=document.createElement("p");
txt.style.margin="1em 0"
txt.setAttribute("id","msgTxt");
txt.innerHTML=str;
document.getElementById("msgDiv").appendChild(txt);

}
</script>

<script type="text/javascript">

$(function(){
scall();

})

</script>

alert的美化,并且随滚动条滚动的更多相关文章

  1. jQuery 滚动条 滚动到底部(下拉到底部) 加载数据(触发事件、处理逻辑)、分页加载数据

    1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...

  2. 当滚动条滚动到页面底部自动加载增加内容的js代码

    这篇文章主要介绍了如何使用javscript实现滚动条滚动到页面底部自动加载增加页面内容,需要的朋友可以参考下..1,注册页面滚动事件,window.onscroll = function(){ }; ...

  3. 判断滚动条滚动到document底部

    滚动条没有实际的高度.只是为了呈现效果才在外型上面有长度. 在js当中也没有提供滚动条的高度API. 参考了网上有关资料:判断滚动条到底部的基本逻辑是滚动条滚动的高度加上视口的高度,正好是docume ...

  4. 解决IE6,IE7下子元素使用position:relative、父元素使用overflow:auto后,子元素不随着滚动条滚动的问题

    解决IE6,IE7下子元素使用position:relative.父元素使用overflow:auto后,子元素不随着滚动条滚动的问题   在IE6,IE7下,子元素使用position:relati ...

  5. 让div固定在顶部不随滚动条滚动

    让div固定在顶部不随滚动条滚动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  6. 如何通过JQuery将DIV的滚动条滚动到指定的位置

    这里有一个方法可以将DIV的滚动条滚动到其子元素所在的位置,方便自动定位. var container = $('div'), inner = $('#inner'); container.scrol ...

  7. js网页滚动条滚动事件实例分析

    本文实例讲述了js网页滚动条滚动事件用法.分享给大家供大家参考.具体分析如下: 在做js返回顶部的效果时,要监听网页滚动条滚动事件,这个事件就是:window.onscroll.当onscroll事件 ...

  8. jQuery粘性跟随滚动条滚动的导航栏源代码下载

    jQuery粘性跟随滚动条滚动的导航栏源代码下载 作者:网页模板 大小:0.005MB 点击次数:3494 发布时间:2014-03-07 12:55 分享到:0 特效介绍 jQuery粘性跟随滚动条 ...

  9. 随滚动条滚动的居中div

    <!-- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  10. WM_SYSCOMMAND包括很多功能,比如:拖动左边框、拖动标题栏、滚动条滚动、点击最小化、双击标题栏——Delphi 通过事件代替了大部分常用的消息,所以Delphi 简单、易用、高效

    procedure TForm1.WMSysCommand(var Message: TWMSysCommand); var str: string; begin case Message.CmdTy ...

随机推荐

  1. CPU五级流水线project(带Hazard)

    project简单介绍: 计算机组成原理课程Project--五级流水线hazard处理 思路说明: CPU架构图: CPU指令集: 代码在这里:cpu_hazard

  2. 一个完整的C++程序SpreadSheet - 1) 类的声明和定义

    1. SpreadsheetCell.h #pragma once #include <string> class SpreadsheetCell { public: void setVa ...

  3. Ubuntu 64位安装32位运行库

    sudo apt-get install ia32-libs 32-64sudo apt-get install libc6:i386sudo apt-get install librt:i386su ...

  4. ZOJ 3630 Information 强连通

    题意:n m表示n个节点,m条边,下面m行a b 表示a-b点有一条有向边 题目:给定有向图,删去一个点后,可以求出该图中强连通分量中最大的点数 问:删去某点后,最大点数 最小是多少 思路:枚举删点, ...

  5. java 清单文件

    Java之jar打包 标签: javajarmanifestmain-classclass-path 2016-03-30 00:29 993人阅读 评论(0) 收藏 举报  分类: Java(6)  ...

  6. TWaver版3D化学元素周期表

    非常早就有人做3D网页版的化学元素周期表了.酷炫效果和新奇技巧一度被众多粉丝奉为神明,争相研究和效仿.甚至有人放弃一切扑向这颗蜡烛.不由总是想到那个OPPO广告女主角拽拽的歧视道:"辞职去旅 ...

  7. 【Oracle】IMP-00010: not a valid export file, header failed verification

    别人给了一个Oracle文件,结果在导入的时候发现有问题,报错如下: IMP-00010: not a valid export file, header failed verification 在网 ...

  8. springmvc处理流程

    SpringMVC核心处理流程: 1.DispatcherServlet前端控制器接收发过来的请求,交给HandlerMapping处理器映射器 2.HandlerMapping处理器映射器,根据请求 ...

  9. 转:【Linux】linux系统中find和whereis查找命令常用示例

    转载至:wanqi博客园:http://www.cnblogs.com/wanqieddy/archive/2011/06/09/2076785.html whereis 命令,直接查找需要的文件名称 ...

  10. MySQL —— 如何快速对比数据?

    我们在MySql中想要对比下两个不同的实例上的数据并且找出差异,除了主键之外我们还要对比每一个字段,应该怎么做呢? 方案一:写一个程序将两个实例里面的每一行数据都分别取出来对比,但是耗时我们无法估计, ...