javascript popup提示

JavaScript022

javascript popup提示,第1张

一下是弹出div层特效代码

<script type="text/javascript">

var prox

var proy

var proxc

var proyc

var isIe=(document.all)?true:false

function setSelectState(state)

{

var objl=document.getElementsByTagName('select')

for(var i=0i<objl.lengthi++)

{

objl[i].style.visibility=state

}

}

function mousePosition(ev)

{

if(ev.pageX || ev.pageY)

{

return {x:ev.pageX, y:ev.pageY}

}

return {

x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,y:ev.clientY + document.body.scrollTop - document.body.clientTop

}

}

//关闭

function closeWindow()

{

if(document.getElementById('back')!=null)

{

document.getElementById('back').parentNode.removeChild(document.getElementById('back'))

}

if(document.getElementById('mesWindow')!=null)

{

document.getElementById('mesWindow').parentNode.removeChild(document.getElementById('mesWindow'))

}

if(isIe){

setSelectState('')}

}

function show(id,ev){/*--打开--*/

closeWindow()

var bWidth=parseInt(document.documentElement.scrollWidth)

var bHeight=parseInt(document.documentElement.scrollHeight)<592?592:parseInt(document.documentElement.scrollHeight)

if(isIe){

setSelectState('hidden')}

var back=document.createElement("div")

back.id="back"

var styleStr="top:0pxleft:0pxposition:absolutebackground:#666width:"+bWidth+"pxheight:"+bHeight+"px"

styleStr+=(isIe)?"filter:alpha(opacity=40)":"opacity:0.40"

back.style.cssText=styleStr

document.body.appendChild(back)

clearInterval(prox)

clearInterval(proy)

clearInterval(proxc)

clearInterval(proyc)

var o = document.getElementById(id)

o.style.display = "block"

o.style.width = "1px"

o.style.height = "1px"

prox = setInterval(function(){openx(o,500)},10)

}

function openx(o,x){/*--打开x--*/

var cx = parseInt(o.style.width)

if(cx <x)

{

o.style.width = (cx + Math.ceil((x-cx)/5)) +"px"

}

else

{

clearInterval(prox)

proy = setInterval(function(){openy(o,300)},10)

}

}

function openy(o,y){/*--打开y--*/

///

var cy = parseInt(o.style.height)

if(cy <y)

{

o.style.height = (cy + Math.ceil((y-cy)/5)) +"px"

}

else

{

clearInterval(proy)

}

}

function closeed(id){/*--关闭--*/

closeWindow()

clearInterval(prox)

clearInterval(proy)

clearInterval(proxc)

clearInterval(proyc)

var o = document.getElementById(id)

if(o.style.display == "block")

{

proyc = setInterval(function(){closey(o)},10)

}

}

function closey(o){/*--打开y--*/

var cy = parseInt(o.style.height)

if(cy >0)

{

o.style.height = (cy - Math.ceil(cy/5)) +"px"

}

else

{

clearInterval(proyc)

proxc = setInterval(function(){closex(o)},10)

}

}

function closex(o){/*--打开x--*/

var cx = parseInt(o.style.width)

if(cx >0)

{

o.style.width = (cx - Math.ceil(cx/5)) +"px"

}

else

{

clearInterval(proxc)

o.style.display = "none"

}

}

/*-------------------------鼠标拖动---------------------*/

var od = document.getElementById("fd")

var dx,dy,mx,my,mouseD

var odrag

var isIE = document.all ? true : false

document.onmousedown = function(e){

var e = e ? e : event

if(e.button == (document.all ? 1 : 0))

{

mouseD = true

}

}

document.onmouseup = function(){

mouseD = false

odrag = ""

if(isIE)

{

od.releaseCapture()

od.filters.alpha.opacity = 100

}

else

{

window.releaseEvents(od.MOUSEMOVE)

od.style.opacity = 1

}

}

//function readyMove(e){

od.onmousedown = function(e){

odrag = this

var e = e ? e : event

if(e.button == (document.all ? 1 : 0))

{

mx = e.clientX

my = e.clientY

od.style.left = od.offsetLeft + "px"

od.style.top = od.offsetTop + "px"

if(isIE)

{

od.setCapture()

od.filters.alpha.opacity = 50

}

else

{

window.captureEvents(Event.MOUSEMOVE)

od.style.opacity = 0.5

}

//alert(mx)

//alert(my)

}

}

document.onmousemove = function(e){

var e = e ? e : event

//alert(mrx)

//alert(e.button)

if(mouseD==true &&odrag)

{

var mrx = e.clientX - mx

var mry = e.clientY - my

od.style.left = parseInt(od.style.left) +mrx + "px"

od.style.top = parseInt(od.style.top) + mry + "px"

mx = e.clientX

my = e.clientY

}

}

function showBackground(obj,endInt)

{

obj.filters.alpha.opacity+=1

if(obj.filters.alpha.opacity<endInt)

{

setTimeout(function(){showBackground(obj,endInt)},8)

}

}

</script>

这是相应的样式

<style type="text/css">

<!--

html,body{

height:100%

}

* {

padding:0

margin:0

}

#upcontent {

list-style-position: outside

list-style-image: none

list-style-type: none

}

#upcontent li {

font-size:12px

color:#333

line-height:150%

}

#bodyL {

float:left

width:84px

margin-right:2px

}

#tittleup {

font-size:14px

font-weight:bold

padding-left:25px

border-bottom-width: 1px

border-bottom-style: solid

border-bottom-color: #d0daec

margin-bottom: 10px

padding-bottom: 10px

}

a.od {

float:right

font-size:14px

text-decoration: none

}

a.od:hover {

color:#FF0000

}

#fd {

background:#EDF1F8

border: 2px solid #849BCA

margin-top:2px

margin-left:2px

float:left

overflow:hidden

position:absolute

left:0px

top:0px

cursor:move

float:left/*filter:alpha(opacity=50)*/

z-index: 10

}

.contentup {

padding:20px

}

}

-->

</style>

一下是引用的方法：

<div id="bodyL"><a href="#" onclick = "show('fd',event)return false">弹出提示</a></div>

<div id="fd" style="display:nonefilter:alpha(opacity=100)opacity:1">

<div class="contentup"><a href="#" class="od" onclick = "closeed('fd')return false">关闭 </a>

<div id="tittleup">友情提示：</div>

<ul id="upcontent">

<li>对不起，您输入的数字超过有效范围。请输入100-200之间的数字，谢谢。</li>

</ul>

</div>

</div>

好了多的我就不说了，希望能对你有所启发。祝您成功！！！

QQ:865287652 非编程爱好者勿加！！！！！

OnClick事件中添加js事件可以实现：ScriptManager.RegisterStartupScript(this, this.GetType(), "", "AspxPopupControl_ID.Show()", true)祝你成功！

popup is used to create javascript popup windows.

popup 用于创建javascript弹出窗口.

{* popup_init must be called once at the top of the page *}

{popup_init src="/javascripts/overlib.js"}

{* create a link with a popup window when you move your mouse over *}

<A href="mypage.html" {popup text="This link takes you to my page!"}>mypage</A>

方法：属性 类型 是否必须 缺省值 描述

text string Yes n/a 弹出窗口中要显示的内容，文本或超文本

trigger string No onMouseOver 触发弹出窗口的条件，可选择onMouseOver(鼠标经过)或onClick(鼠标单击)

sticky boolean No false 弹出窗口始终显示，直到关闭

caption string No n/a 标题文本内容

fgcolor string No n/a 弹出窗口内部颜色

bgcolor string No n/a 弹出窗口边框颜色

textcolor string No n/a 弹出窗口内部文字颜色

capcolor string No n/a 弹出窗口标题颜色

closecolor string No n/a 设置"关闭"文本信息的颜色

textfont string No n/a 设置内容文本使用的字体类型

captionfont string No n/a 设置标题文本的字体

closefont string No n/a 设置"关闭"文本信息的字体类型

textsize string No n/a 设置内容文本使用的字体大小

captionsize string No n/a 设置标题文本使用的字体大小

closesize string No n/a 设置"关闭"文本信息的字体大小

width integer No n/a sets the width of the box设置宽度

height integer No n/a sets the height of the box设置高度

left boolean No false 使弹出窗口位于鼠标左侧

right boolean No false 使弹出窗口位于鼠标右侧

center boolean No false 使弹出窗口的中间位置和鼠标位置重合

above boolean No false 使弹出窗口位于鼠标上侧. 注: 仅在设置了height属性时有效

below boolean No false 使弹出窗口位于鼠标下侧

border integer No n/a 决定弹出窗口的边框厚度

offsetx integer No n/a 横向显示位置偏移量

offsety integer No n/a 纵向显示位置偏移量

fgbackground url to image No n/a 使用背景图片代替背景颜色

bgbackground url to image No n/a 使用背景图片代替边框颜色. 注1: 必须设置bgcolor为""，边框颜色才不会显示. 注2: 当有关闭链接时，Netscape会重新渲染表格，看起来可能会有点问题.

closetext string No n/a 自定义关闭链接显示文本

noclose boolean No n/a 不显示关闭链接

status string No n/a 设置状态栏显示的文本

autostatus boolean No n/a 设置弹出窗口状态栏显示的文本为当前窗口状态栏显示的文本. 注: 该设置将覆盖status的设置

autostatuscap string No n/a 设置状态栏显示的文本为标题栏显示的信息. 注: 该设置将覆盖status和autostatus设置

inarray integer No n/a 该属性告诉overLib在ol_text数组中读该属性指定的索引的元素到text中. 该属性可以代替text属性

caparray integer No n/a 该属性告诉overLib在ol_caps数组中读该属性指定的索引的元素到caption中.

capicon url No n/a 弹出前先显示该图象

snapx integer No n/a 横向将弹出窗口附着于指定位置

snapy integer No n/a 纵向将弹出窗口附着于指定位置

fixx integer No n/a 锁定弹出窗口的横向位置. 注: 该设置将覆盖其它横向设置

fixy integer No n/a 锁定弹出窗口的纵向位置. 注: 该设置将覆盖其它纵向设置

background url No n/a 设置图象作为输出表格区块的背景

padx integer,integer No n/a 在背景图象后附加横向空白. 注: 该属性有两个参数

pady integer,integer No n/a 在背景图象后附加纵向空白. 注: 该属性有两个参数

fullhtml boolean No n/a 允许用户完全控制背景图片上的HTML. HTML代码位于"text"属性中

frame string No n/a 控制弹出窗口在不同的框架中. 关于此函数更多详细信息，请查阅overlib文档.

timeout string No n/a 调用特定javascript脚本函数，将返回值显示在弹出窗口中.

delay integer No n/a 使得弹出窗口像一个工具提示，窗口将显示到该属性指定的时间(毫秒)

hauto boolean No n/a 自动决定弹出窗口位于鼠标的左侧或右侧.

vauto boolean No n/a 自动决定弹出窗口位于鼠标的上侧或下侧.