一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

怎么用js 动态增加蒙板 内嵌网页内容

时间:2010-11-20 编辑:简简单单 来源:一聚教程网

$()和$c()分别表示
$(id),获取该id的对象,document.getelementbyid(id)
$c(tag),创建一个标签, document.createelement(tag);


//初始化导航背景,iframe容器

function fndaohangbg()
{
var h = fngetheight(),w = fngetwidth();//获取背景窗口大小
if(!$('divdaohangbg'))
{
var div = $c('div');//创建背景蒙板
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.px';
div.style.px';
document.body.appendchild(div);
}

if(!$('divdaohangbgiframe'))
{
var iframe;
iframe = this.$c('iframe');//创建蒙板内的内嵌iframe容器,用于嵌入显示其他网页
iframe.id = 'divdaohangbgiframe';
iframe.frameborder = '0';
iframe.scrolling = "no";
iframe.style.overflow = 'hidden';
iframe.allowtransparency = 'true';
iframe.style.display = 'none';
iframe.style.px';//800
iframe.style.px';//620
iframe.style.margintop = '75px';//800
$('divdaohangbg').appendchild(iframe);
}
if(!$('divdaohangbgclose'))
{
var div = $c('div');//创建关闭按钮在蒙板上
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.;
div.style.;
div.title='关闭';
div.style.cursor='hand';
div.onclick=function(){//点击时间 ,关闭蒙板
fndaohangbgclose();
};
$('divdaohangbg').appendchild(div);
}
$('divdaohangbgiframe').style.display='block';
$('divdaohangbg').style.display='block';
}
//关闭蒙板
function fndaohangbgclose()
{
if(!$('divdaohangbg')){return;}
if(!$('divdaohangbgiframe')){return;}
$('divdaohangbgiframe').src='';
$('divdaohangbgiframe').style.display='none';
$('divdaohangbg').style.display='none';
}
//调用,内嵌url
function fndaohangbgshow(url)
{
fndaohangbg();
$('divdaohangbgiframe').src=url;
}

总结
用于在现有窗口上加载蒙板,在蒙板内在嵌入其他页面内容

 

热门栏目