JS實(shí)現(xiàn)彈出居中的模式窗口示例
更新時(shí)間：2016年06月20日 09:21:25 作者：cherry
這篇文章主要介紹了JS實(shí)現(xiàn)彈出居中的模式窗口,涉及javascript模式窗口及頁面元素的動(dòng)態(tài)操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
本文實(shí)例講述了JS實(shí)現(xiàn)彈出居中的模式窗口。分享給大家供大家參考，具體如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS彈出窗口</title>
</head>
<body>
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
<script>
function OpenDialog(url,w, h) {
var iTop2 = (window.screen.availHeight - 20 - h) / 2;
var iLeft2 = (window.screen.availWidth - 10 - w) / 2;
var params = 'menubar:no;dialogHeight=' + h + 'px;dialogWidth=' + w + 'px;dialogLeft=' + iLeft2 + 'px;dialogTop=' + iTop2 + 'px;resizable=yes;scrollbars=0;resizeable=0;center=yes;location:no;status:no'
var addDiv = $("<div id = 'tempDiv' style='left:0px;top:0px;position:absolute;width:100%;height:100%;background:rgba(0,0,0,0.4)!important;filter:alpha(opacity = 40);background:#000;z-index:1000;'></div>");
$(document.body).append(addDiv); //添加一個(gè)蒙板作背景
window.open(url, addDiv, params);
}
OpenDialog("http://m.fzitv.net",300,300);
</script>
</body>
</html>
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動(dòng)畫特效與技巧匯總》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了微信小程序自定義模態(tài)彈窗組件，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-12-12
let是ES6里面新的復(fù)制命令，let賦值命令只可以在{}代碼塊中被調(diào)用。這篇文章主要介紹了ES6中的let命令,需要的朋友可以參考下2016-12-12
JavaScript使用Replace進(jìn)行字符串替換的方法
這篇文章主要介紹了JavaScript使用Replace進(jìn)行字符串替換的方法,涉及Replace進(jìn)行一次替換與全部替換的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04
輪播圖是我們?nèi)粘ｉ_發(fā)中經(jīng)常會(huì)遇到的一個(gè)需求,下面這篇文章主要給大家介紹了關(guān)于微信小程序滾動(dòng)、輪播圖和文本的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-08-08
現(xiàn)在網(wǎng)上有非常多的Promise文章，但都是給你一堆代碼，或者某些核心代碼，讓你看完之后感覺，嗯，很厲害，但還是不知所云，不知其所以然。那么本文真正從一個(gè)小白開始帶你深入淺出，一步一步實(shí)現(xiàn)自己的 Promise，這種自己造輪子的過程一定是進(jìn)步最快的過程，快上車開始吧2022-11-11
跟我學(xué)習(xí)javascript的閉包，這篇文章的目的就是讓大家對(duì)javascript閉包有一個(gè)非常全面的了解，感興趣的小伙伴們可以參考一下。2015-11-11
JS實(shí)現(xiàn)表單中checkbox對(duì)勾選中增加邊框顯示效果
這篇文章主要介紹了JS實(shí)現(xiàn)表單中checkbox對(duì)勾選中增加邊框顯示效果,可實(shí)現(xiàn)點(diǎn)擊后圖片增加邊框及勾選的功能,非常簡潔實(shí)用,需要的朋友可以參考下2015-08-08
localStorage的黑科技-js和css緩存機(jī)制
本文主要介紹了localStorage的黑科技-js和css緩存機(jī)制的相關(guān)知識(shí)，具有一定的參考價(jià)值，下面跟著小編一起來看下吧2017-02-02
下面小編就為大家?guī)硪黄鶭S:Date對(duì)象全面解析。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-09-09
如何在javascript 中使用 xmlHttpRequest 發(fā)送 POST
本文將通過不同的示例解釋如何使用JavaScript代碼在AJAX編程中發(fā)送 XMLHttpRequest post 請(qǐng)求，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友參考下吧2023-07-07