I want to fill the parent window height with respect to the sub window height which is loading using ajax (mootools).
For example if the parent window height is normal and the loading child window height is 1200px (saying), when the child window load the height of the parent window changs but the backgorund color which is given 100% not fill the parent window.
I have given my example codes, please give a solution as soon as possible,
Thank You,
this is my javascript named as effect.js
Expand|Select|Wrap|Line Numbers
- function dimBg() {
- document.getElementById("contentarea").style.visibility = "hidden";
- var conjoin = new Chain();
- function fadeinBg(){
- var dimmerObj = new Fx.Style($('Bg'), 'opacity', {duration: 200, transition: Fx.Transitions.Quart.easeInOut});
- dimmerObj.start(0.0,0.75); // fade in Bg
- }
- function fadeinqwe(){
- var dimmerObj = new Fx.Style($('midim'), 'opacity', {duration: 200, transition: Fx.Transitions.Quart.easeInOut});
- dimmerObj.start(0.0,0.5); // fade in Bg
- }
- function fadeinPage(){
- var focusObj = new Fx.Style($('contentarea'), 'opacity', {duration: 500, transition: Fx.Transitions.Quart.easeInOut});
- focusObj.start(0,1); // fade in contentarea.
- }
- conjoin.chain(fadeinBg);
- conjoin.chain(fadeinqwe);
- conjoin.chain(fadeinPage);
- conjoin.callChain();
- conjoin.callChain.delay(200, conjoin);
- conjoin.callChain.delay(1900, conjoin);
- }
- // load link on top of the homepage itself using AJAX.
- var bustcachevar=1 //bust potential caching of external pages after initial request? (1=yes, 0=no)
- var loadedobjects=""
- var rootdomain="http://"+window.location.hostname
- var bustcacheparameter=""
- function loadLink(url, containerid){
- // start link load by dimming out the BG.
- dimBg();
- var page_request = false
- if (window.XMLHttpRequest) // if Mozilla, Safari etc
- page_request = new XMLHttpRequest()
- else if (window.ActiveXObject){ // if IE
- try {
- page_request = new ActiveXObject("Msxml2.XMLHTTP")
- }
- catch (e){
- try{
- page_request = new ActiveXObject("Microsoft.XMLHTTP")
- }
- catch (e){}
- }
- }
- else
- return false
- page_request.onreadystatechange=function(){
- loadpage(page_request, containerid)
- }
- if (bustcachevar) //if bust caching of external page
- bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
- page_request.open('GET', url+bustcacheparameter, true)
- page_request.send(null)
- }
- function loadpage(page_request, containerid){
- if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
- document.getElementById(containerid).innerHTML=page_request.responseText
- }
- function loadobjs(){
- if (!document.getElementById)
- return
- for (i=0; i<arguments.length; i++){
- var file=arguments[i]
- var fileref=""
- if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
- if (file.indexOf(".js")!=-1){ //If object is a js file
- fileref=document.createElement('script')
- fileref.setAttribute("type","text/javascript");
- fileref.setAttribute("src", file);
- }
- else if (file.indexOf(".css")!=-1){ //If object is a css file
- fileref=document.createElement("link")
- fileref.setAttribute("rel", "stylesheet");
- fileref.setAttribute("type", "text/css");
- fileref.setAttribute("href", file);
- }
- }
- if (fileref!=""){
- document.getElementsByTagName("head").item(0).appendChild(fileref)
- loadedobjects+=file+" " //Remember this object as being already added to page
- }
- }
- }
Expand|Select|Wrap|Line Numbers
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
- <script type="text/javascript" src="mootools.js"></script>
- <script type="text/javascript" src="effects.js"></script>
- <title>Untitled Document</title>
- <script type="text/javascript">
- function dimtest(){
- document.getElementById('bg').style.visibility="visible";
- }
- </script>
- <style type="text/css">
- body{
- border-bottom:0px;
- border-left:0px;
- border-right:0px;
- border-top:0px;
- height:100%;
- margin:0px;
- }
- .outer {width:100%; height:100%;background:#000000; border-bottom:0px; border-right:0px; border-right:0px; border-top:0px; margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:-50px; visibility:hidden;}
- .footer {width:100%;height:100%;background:yellow}
- </style>
- </head>
- <body>
- <div id="Bg" class="outer" ></div>
- <div style="width: 100%; position: absolute; top: 0px; left: 0px; z-index:40;">
- <div id="contentarea" style="margin:90px auto; margin:5% 5%;width:90%; position:absolute; background-color:#FFFFFF; visibility:hidden; "></div>
- </div>
- <div id="midim" style="top:100px;left:500px; position:absolute; font-size:36px; color:#990000; "><a id="dimbg();" href="javascript:loadLink('testround.html', 'contentarea');" >click here</a></div>
- </body>
- </html>
Expand|Select|Wrap|Line Numbers
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
- <html>
- <head>
- <title>Nifty Corners: HTML CSS rounded corners</title>
- <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
- <meta name="generator" content="HAPedit 3.1">
- <style type="text/css">
- body{padding: 20px;background-color: #FFF;
- font: 100.01% "Trebuchet MS",Verdana,Arial,sans-serif; height:100%;}
- h1,h2,p{margin: 0 10px}
- h1{font-size: 250%;color: #FFF}
- h2{font-size: 200%;color: #f0f0f0}
- p{padding-bottom:1em}
- h2{padding-top: 0.3em}
- div#nifty{ margin: 0 10%;background: #9BD1FA}
- b.rtop, b.rbottom{display:block;background: #FFF}
- b.rtop b, b.rbottom b{display:block;height: 1px;
- overflow: hidden; background: #9BD1FA}
- b.r1{margin: 0 5px}
- b.r2{margin: 0 3px}
- b.r3{margin: 0 2px}
- b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}
- </style>
- </head>
- <body>
- <div id="nifty">
- <b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <h1>Nifty Corners</h1>
- <p>Auiiui uieiouo auuaa oiaue uaou iioiiou uiio a io ieeoai uaouoe uoiaau eeauauou u oiauuie eo ui.</p>
- <h2>Rounded corners without images</h2>
- <p>Aaeao aiieuouiu io ueuiieu uei oeio uooiau uue ooiea ooiaui eue ouue i uiaoo iouieiuia uueeo ieieuiiau
- ueaooa iou iaeieuo uoao iauoi u i oeioooe auo a ooe u uuuo oaooaae uoa iuiuiaeu iioaeu uuiu eeu ea eouoiuo ua o.</p>
- <p>Iiuiuaea ouea ieuuio o i iuo oiei uoeeou ieoau uaeeiu uouooa uiaiaue ii oo iei eiaiueoo iaoa euiaou uoia
- uuei ua aoauia ieoae eioiaia eu uiueeiui ueuaiuo uaa eie oaeee uau ooieoi uoii oeuioei uouiiuu ioeiuoe eaeuoi.</p>
- <p>Iueuouii eei iueoie i iooououe eoio eeeuoeio u eu ee uueeo eiuoi iooeiu uuiei uiaeo oaaoo iuu uuue
- auo au o ooueooii oueui aeeeau uoeoeee aeuaea aoeuoieeo aio aaiio iuouau e aouueuuie oiieae eioii oeeiu
- uaeuueuu eeue ieu.</p>
- <b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
- </div>
- </body>
- </html>
thank you so much..