Home > Web Front-end > JS Tutorial > body text

javascript window loading mask embedded web content_javascript skills

WBOY
Release: 2016-05-16 18:15:53
Original
1114 people have browsed it
Copy code The code is as follows:

//Initialize navigation background, iframe container
function fnDaoHangBg()
{
var h = fnGetHeight(),w = fnGetWidth();//Get the background window size
if(!$('divDaoHangBg'))
{
var div = $ C('div');//Create a background mask
div.id = 'divDaoHangBg';
div.style.backgroundColor = 'black';
div.style.position = 'absolute';
div.style.filter = 'alpha(opacity=80)';
div.style.opacity = '.80';
div.style.zIndex = 100001;
div.style. left = 0;
div.style.top = 0;
div.style.width = w 'px';
div.style.height= h 'px';
document.body. appendChild(div);
}

if(!$('divDaoHangBgIframe'))
{
var iframe;
iframe = this.$C('IFRAME'); //Create an inline iframe container within the mask for embedded display of other web pages
iframe.id = 'divDaoHangBgIframe';
iframe.frameBorder = '0';
iframe.scrolling = "no" ;
iframe.style.overflow = 'hidden';
iframe.allowTransparency = 'true';
iframe.style.display = 'none';
iframe.style.width = w 'px ';//800
iframe.style.height = h 'px';//620
iframe.style.marginTop = '75px';//800
$('divDaoHangBg').appendChild( iframe);
}
if(!$('divDaoHangBgClose'))
{
var div = $C('div');//Create a close button on the mask
div.id = 'divDaoHangBgClose';
div.style.position = 'absolute';
div.style.backgroundImage='url(images/closb.gif)';
div.style.zIndex = 100003;
div.style.right = 10;
div.style.top = 20;
div.style.width = '82px';
div.style.height= '30px';
div.title='Close';
div.style.cursor='hand';
div.onclick=function(){//Click time to close the mask
fnDaoHangBgClose();
};
$('divDaoHangBg').appendChild(div);
}
$('divDaoHangBgIframe').style.display='block';
$('divDaoHangBg' ).style.display='block';
}
//Close the mask
function fnDaoHangBgClose()
{
if(!$('divDaoHangBg')){return;}
if(!$('divDaoHangBgIframe')){return;}
$('divDaoHangBgIframe').src='';
$('divDaoHangBgIframe').style.display='none';
$('divDaoHangBg').style.display='none';
}
//Call, embedded url
function fnDaoHangBgShow(url)
{
fnDaoHangBg() ;
$('divDaoHangBgIframe').src=url;
}

where $() and $C() respectively represent
$(id), get the id Object, document.getElementById(id)
$C(tag), create a tag, document.createElement(tag);
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!