AJAX

Open new window without title & address bars in firefox

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

•

Join Date: May 2009

Posts: 3

Reputation: Baddesley is an unknown quantity at this point

Solved Threads: 0

Baddesley

Offline

Newbie Poster

Open new window without title & address bars in firefox

Aug 31st, 2009

Hi everyone, hope someone can help. I'm very much a beginner in Javascript and 'ok' in html but just cannot get a new (picture) window to open in Firefox without the title and address bars (or anything else, just the image). IE shows just the title bar, with or without the code:

 Help with Code Tags 
 JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
function newWindow()
{window.open('./pageaddress.html','winname','top=20,left=20,directories=0,titlebar=0,toolbar=0,location=0,status=0,menubar=0,scrollbars=no,resizable=no,width=400,height=350');}
</script>
function newWindow()
{window.open('./pageaddress.html','winname','top=20,left=20,directories=0,titlebar=0,toolbar=0,location=0,status=0,menubar=0,scrollbars=no,resizable=no,width=400,height=350');}
</script>

The window opens fine, but always shows the address and title bars. I have read the W3 Schools options list (and other posts) and tried both 'no' and '0' as values, without any success. What am I missing and is there any way to make this work - it didn't even work in the W3 Schools 'try it yourself' test page!

I have seen some very nice 'slowly-opening' windows (increasing in size), which would be even better, any links to info on these would also be much appreciated. Thanks in advance.

•

Join Date: Apr 2009

Posts: 817

Reputation: Airshow is on a distinguished road

Solved Threads: 116

Airshow

Offline

Practically a Posting Shark

Re: Open new window without title & address bars in firefox

Aug 31st, 2009

Baddesley,

I can only imagine that this is the result of some FF setting - "always open windows with full title bar" or similar. If so, then you could correct it for yourself but some other users will still see the original behaviour.

A workaround would be to show/hide an absolutely positioned div in your main window, such that it sits on top of all other content. Such a "window" can be populated with content using DHTML/DOM methods and will be "modal" in behaviour by default. You will need to include a "close" button/link such that, once displayed, it can be re-hidden.

Alternatively, maybe someone knows something more than I about window.open in FF.

Airshow

Last edited by Airshow; Aug 31st, 2009 at 2:41 pm.

50% of the solution lies in accurately describing the problem!

•

Join Date: May 2009

Posts: 3

Reputation: Baddesley is an unknown quantity at this point

Solved Threads: 0

Baddesley

Offline

Newbie Poster

Re: Open new window without title & address bars in firefox

Aug 31st, 2009

Thanks for the quick reply Airshow, but yes, I do need a fix that works for everyone, no matter what their (or my) local FF setting are.

I'm not sure what you mean about the 'modal' behaviour of hiding the bars behind an absolutely positioned div, but it doesn't sound like the way I want to go. Many sites have click(or hover)-to-open, plain, unadorned new-window (larger) images for products - which s what I want it for - so it must be possible. Hopefully, someone else will know. Thanks anyway.

•

Join Date: Aug 2008

Posts: 954

Reputation: essential will become famous soon enough

Solved Threads: 131

essential

Offline

Posting Shark

Re: Open new window without title & address bars in firefox

Sep 1st, 2009

Hi,

obtaining Airshow's suggestion of the DOM procedure over the document and also i've applied some iframes to simulate real window experience:

 Help with Code Tags 
 JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>www.daniweb.com</title>
<style type="text/css">
<!--
body { min-height : 600px; }
-->
</style>
<script type="text/javascript">
<!--
function newWindow( p, w, h, e ) {
var e = e ? e : window.event;
var x = 0;
var y = 0;
   if ( e.pageY || e.pageX ) {
      x = e.pageX;
      y = e.pageY;
   } else if ( e.clientX || e.clientY ) {
      var db = document.body;
      var dde = document.documentElement;
      x = e.clientX + db.scrollLeft + dde.scrollLeft;
      y = e.clientY + db.scrollTop + dde.scrollTop;
   }
var p = p;
var w = w;
var h = h;
var name = "iframeOne";
var id = name;
   if (( "createElement" && "getElementById" ) in document ) {
   var fragment = document.createDocumentFragment();
   var win = document.createElement("div");
   var iframe = document.createElement("iframe");
   var settings = {
   frameBorder : 0,
   noResize : 0,
   marginHeight : 0,
   marginWidth : 0,
   width : w,
   height : h,
   style : "position : relative",
   name : name,
   id : id
   };
   win.setAttribute( "style", "width : " + w + "px; height : " + h + "px; position : absolute; top : " + y + "px; left : " + x + "px; border : 1px solid #C0C0C0" );
   win.appendChild( iframe );
      for ( var properties in settings ) {
         if ( iframe[ properties ] ) {
         iframe[ properties ] = settings[ properties ];
         continue; 
         } iframe.setAttribute(( properties ).toLowerCase(), settings[ properties ] );
      } fragment.appendChild( win );
    document.body.appendChild( fragment );
   iframe.src = ( function( url ) {
   var path = new Image;
   path.src = url;
      return path.src;
   } )( p );
   }
}
 
 
 
//-->
</script>
</head>
<body>
<noscript>
<p> This site requires a browser that support <b>JavaScript</b>. </p> 
</noscript>
<div id="div">
<input type="button" value="simulate window" onclick="newWindow( 'test.html', 300, 300 );"></div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>www.daniweb.com</title>
<style type="text/css">
<!--
body { min-height : 600px; }
-->
</style>
<script type="text/javascript">
<!--
function newWindow( p, w, h, e ) {
var e = e ? e : window.event;
var x = 0;
var y = 0;
   if ( e.pageY || e.pageX ) {
      x = e.pageX;
      y = e.pageY;
   } else if ( e.clientX || e.clientY ) {
      var db = document.body;
      var dde = document.documentElement;
      x = e.clientX + db.scrollLeft + dde.scrollLeft;
      y = e.clientY + db.scrollTop + dde.scrollTop;
   }
var p = p;
var w = w;
var h = h;
var name = "iframeOne";
var id = name;
   if (( "createElement" && "getElementById" ) in document ) {
   var fragment = document.createDocumentFragment();
   var win = document.createElement("div");
   var iframe = document.createElement("iframe");
   var settings = {
   frameBorder : 0,
   noResize : 0,
   marginHeight : 0,
   marginWidth : 0,
   width : w,
   height : h,
   style : "position : relative",
   name : name,
   id : id
   };
   win.setAttribute( "style", "width : " + w + "px; height : " + h + "px; position : absolute; top : " + y + "px; left : " + x + "px; border : 1px solid #C0C0C0" );
   win.appendChild( iframe );
      for ( var properties in settings ) {
         if ( iframe[ properties ] ) {
         iframe[ properties ] = settings[ properties ];
         continue; 
         } iframe.setAttribute(( properties ).toLowerCase(), settings[ properties ] );
      } fragment.appendChild( win );
    document.body.appendChild( fragment );
   iframe.src = ( function( url ) {
   var path = new Image;
   path.src = url;
      return path.src;
   } )( p );
   }
}


  
//-->
</script>
</head>
<body>
<noscript>
<p> This site requires a browser that support <b>JavaScript</b>. </p> 
</noscript>
<div id="div">
<input type="button" value="simulate window" onclick="newWindow( 'test.html', 300, 300 );"></div>
</body>
</html>

hope it gets what you need.

Last edited by essential; Sep 1st, 2009 at 6:06 am.

Dev.Opera — FOLLOW THE STANDARDS, BREAK THE RULES...

•

Join Date: May 2009

Posts: 3

Reputation: Baddesley is an unknown quantity at this point

Solved Threads: 0

Baddesley

Offline

Newbie Poster

Re: Open new window without title & address bars in firefox

Sep 5th, 2009

Thanks Essential.

I'll have a go, but it looks unbelieveably complicated to me - I'm very much a beginner at JavaScript! What I was really afer was to see if anyone had any idea why the standard W3 options for the 'window.open' function (as above) simply don't work - they are very simple and are supposed to work!