弹出窗口根据内容自动调整大小的JS解决方案

转载 2007年09月21日 10:11:00

父类(主/打开)窗口中代码为:

 

 

 

<html>
<head><title>父类窗口</title>
<script type="text/javascript">
var s,oRes;
 
function openwin(url)
 
{
     s
=window.open("child.htm");    
    oRes
=s.document.getElementById("txt");
    
//文本改变时还回
    //oRes.onchange=function(){
    //alert("text changed");
    //document.getElementById("txtRet").value=oRes.value;}
    //子窗口关闭时还回,另一种方法传参数
    //var btnChild=s.document.getElementById("btnSubmit");
    //btnChild.onclick=function(){
    //alert("btn clicked");
    //document.getElementById("txtRet").value=oRes.value;}
 }

 
function childclose(txt)
{
    document.getElementById(
"txtRet").value=txt;
}

</script>
<body>
<form>
<input type="text" id="txtRet" name="txtRet" />
<input type="button" value="按钮" onclick="openwin('child.htm')" />
</form>
</body>
</html>

 

在之类弹出窗口加入resizeto(window.clientWidth,window,clientHeight)代码:

 

 

<!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>
    
<title>子类窗口</title>
    
<script type="text/javascript">
    window.open
=function() {
        
if(window.opener)
            
{
           width
=document.body.clientWidth+33;
           height
=document.body.clientHeight+50;
           window.resizeTo(width,height);
       }

    }
    
    
</script>
</head>
<body style="margin:0px;" onload="win_onLoad()">
<input type="text" id="txt" name="txt" />
<input type="button" id="btnSubmit" name="btnSubmit" value="确定" />
<script type="text/javascript">
btnSubmit.onclick
=function(){
        
if(window.opener)
        
{
            window.opener.childclose(document.getElementById(
"txt").value);
            window.setTimeout(
function(){self.close();},500);
        }

        
else
        
{
            self.close();
        }

    }

</script>
</body>
</html>

 

 referrence:http://topic.csdn.net/t/20040623/09/3114967.html

根据内容自动调整弹出窗口大小的JS解决方案

问题         在弹出创苦时,根据窗口的内容来自动调节窗口的大小,窗口如果已经和屏幕相等大小时则出现滚动条。 解决方案         在弹出的页面中添加一JS脚本方法win_onLoad(),...
  • feng19821209
  • feng19821209
  • 2005年09月02日 00:01
  • 2198

页面中最常用的弹框。自适应。适合移动端。

我们经常会很头疼如何实现一个对象自然的居中。正好显示在窗口的中间部分。我也是刚刚好好研究了一份。才发现这其中的奥妙。顿时觉得豁然开朗。 前提1:我们讨论的是当弹框的宽度为百分比,高度根据内容自适应,...
  • hewu1122
  • hewu1122
  • 2016年01月12日 22:43
  • 3929

window.open网页自适应不同分辨率方法

当你使用window.open函数时,想让打开的新窗口,可以自适应不同电脑分辨率,使用以下js       var ww = window.screen.width;        var...
  • free3people
  • free3people
  • 2016年02月27日 10:10
  • 1460

自适应弹出框-垂直居中

自适应弹出框 .box-mask { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #...
  • liyuedan
  • liyuedan
  • 2015年05月12日 17:37
  • 8513

弹出窗口根据内容自动调整大小的JS解决方案

父类(主/打开)窗口中代码为:   html>head>title>父类窗口title>script type="text/javascript">...var s,oRes; function op...
  • beimuaihui
  • beimuaihui
  • 2007年09月21日 10:11
  • 1023

自适应图片大小的弹出窗口

        很多时候我们需要提供这样的功能给访问者:当访问者点击页面中的缩略图时,其对应的全尺寸图片将显示在一个新的弹出窗口中供访问者查看。   实现此功能的最简单作法是用以下HTML代码创建一个...
  • feng19821209
  • feng19821209
  • 2005年01月19日 22:14
  • 1322

iframe自动根据内容调整大小

出处:http://blog.163.com/xx_jun_/blog/static/20827520920125169374412 最近做网页开发,用到了iframe,其实以前也用这个,不过由...
  • u012931864
  • u012931864
  • 2015年12月21日 09:29
  • 642

js实现textarea根据内容大小自适应高度

首先,我们来看看源代码: /** * 文本框根据输入内容自适应高度 * @param {HTMLElement} 输入框元素 * @param ...
  • sinolzeng
  • sinolzeng
  • 2014年12月26日 11:51
  • 2439

一个关于新窗口自动调节大小的问题

文字刚好充满窗口,不出现滚动条。测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试...
  • riyao
  • riyao
  • 2006年01月02日 14:45
  • 894

ASP.NET实现自适应图片大小的弹出窗口(窗口可任意编辑)

在最近的项目中,遇到一个问题,要实现这样的效果:      点pic_small.Aspx页面的缩略图后弹出pic_all.aspx页面,pic_all...
  • zhanglei5415
  • zhanglei5415
  • 2007年05月08日 13:34
  • 754
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:弹出窗口根据内容自动调整大小的JS解决方案
举报原因:
原因补充:

(最多只允许输入30个字)