Jump to content

createPopup()


Jack McKalling

Recommended Posts

This:

window.createPopup()
Is really, and I mean really cool!! :)But there isn't much explained about it though :(It is in the JavaScript tutorial, HTML DOM object reference, Window-object, the last example.Nothing more :blink: Only its syntax... :) Can it be more explained? :D I want to use it more efficiently, like opening a file in it. Or like as a tooltip :( Whatever, but how all?The specs for its location is not difficult. But the others do. Please :)
Link to post
Share on other sites

Example:I want p=window.createPopup() and below it p.document.src="", so I can load a document in it instead of writing it right in this one. This comes in handy when I plan to use it as a Tooltip (like the attribute title="") on hovering one element, or clicking a button (like to show some help info).It also comes in handy when I want to activate the curent window and terminate the popup at the same time, by clicking in the window or popup. This is not possible when I use window.open() or the modelessdialogbox / modaldialogbox.

Link to post
Share on other sites
No bradley.lee, you haven't read my explanation.window.open() is not what I want, window.createPopup() is.

Only way i can think of is something like bradly.lee's approach.
var someWindow = window.open("somepage.htm", "_blank");someWindow.document.writeln("Hello"); // Would write "Hello" into the POPUP windowsomeWindow.alert("Hello"); // Would create an alert box in the POPUP window

I know this works before because I have used it in my JavaScript Login and Admin Management Software...

Link to post
Share on other sites

No.That is really not what I want.Take it I want to have a popup field with explaining text about the hovered element when hovering it :)Exactly when someone hoveres an IMG with a certain ALT specified. The person would get a tooltip there too, wouldn't he :)The popup would be just like another layer on the document, cascading everything that is behind it, not caring about characters that would be cut-off. Like a tooltip which is the text specified in ALT by an IMG, the popup would disappear when you click in the window or the tooltip.As I said before, and I shall say it again: the window.open() is not able to do that. You can't open a window that closes itself when the other window is clicked. Popups do :(

Link to post
Share on other sites

Well, i have no clue how they do that. I haven't checked their source yet. But you probably do now :)

Link to post
Share on other sites

I checked it right away, and indeed, in two years I would not have come cross the first pages :)Lets not care about their sollution, lets care about new lessons, about my way :)I read the example of the .createPopup(), and I understand most of it. But it is just a definition of a new document, defined inside the first document. How about an SRC to an external document :( I tried it, I am sure of 100%, that it is possible to apply a source to the popup. While the popup showed a blank document field above the window when a source, but nothing when invalid code had been applied.I mean, when I tried to give the popup a source, it did show the popup, but not the file inside. When I tried invalid code for that, then the popup did not show at all. So a source should be possible, I only didn't code it correct. I conclude that an external file for a popup should only be NOT possible when the popup does not show at all, just like when it wasn't valid at all.Before I dig up my test, knows anyone the correct syntax of a source Popup?

Link to post
Share on other sites

Going back to a point that was brought up a while back...isn't the whole idea of w3schools to promote cross-browser coding methods....? Why pick a "solution" to your problem that relies on a method that not everyone will be able to take advantage of? I can't see any good reason why you wouldn't wish to invest your time looking into a floating DIV which would provide much better access to your page, and increase your knowledge of coding.For someone who prefers sticking to strict XHTML rules, it seems, why not try something w3c valid?

Link to post
Share on other sites

Lol! :)Yes indeed... I should have thought about that before..Anyway, try to read this little bit complicated code :)

function ShowPopup(){var p = window.createPopup()var pbody = p.document.bodypbody.style.verticalAlign="middle"pbody.style.border="4px outset #ffa500"pbody.style.backgroundColor="#eeffaa"pbody.innerHTML = '<ul style="float:left; width:100%; padding:0; margin:0; list-style-type:none">'  + '<li style="display:inline; cursor:default">'  + '<span style="float:left; width:90%; color:black; padding:0.4em 5px">'  + 'Your content</span></li>'  + '<li style="display:inline; cursor:pointer">'  + '<span style="float:right; width:20px; color:navy; padding:0px; border:1px double; border-color:white white black black; '  + 'background-color:#cc6666; font-family:verdana; font-weight:bold; font-size:14px; text-align:center" '  + 'onmouseover="this.style.backgroundColor=\"#ff66cc\";this.style.borderColor=\"black black white white\"" '  + 'onmouseout="this.style.backgroundColor=\"#cc6666\";this.style.borderColor=\"white white black black\"">X</span></li></ul>'pbody.childNodes[0].childNodes[1].onclick = function () { p.show(0,0,0,0,document.body) }p.show(hposition,vposition,width,height,document.body)}
Link to post
Share on other sites
Going back to a point that was brought up a while back...isn't the whole idea of w3schools to promote cross-browser coding methods....? Why pick a "solution" to your problem that relies on a method that not everyone will be able to take advantage of?  I can't see any good reason why you wouldn't wish to invest your time looking into a floating DIV which would provide much better access to your page, and increase your knowledge of coding.For someone who prefers sticking to strict XHTML rules, it seems, why not try something w3c valid?

He could try this, I found it on a open source website (i think it was dhtmlcentral) where you mouseover an object and it displays a moving floating div, that moves with the mouse. u can download the source code js file from the website belowDHTML Centralthen click download sourcecode and imagesIt does say it only works for links, but you can use it for anything that supports the onMouseover event, which means it should be cross-browser.
Link to post
Share on other sites
No.That is really not what I want.Take it I want to have a popup field with explaining text about the hovered element when hovering it :)Exactly when someone hoveres an IMG with a certain ALT specified. The person would get a tooltip there too, wouldn't he :)The popup would be just like another layer on the document, cascading everything that is behind it, not caring about characters that would be cut-off. Like a tooltip which is the text specified in ALT by an IMG, the popup would disappear when you click in the window or the tooltip.As I said before, and I shall say it again: the window.open() is not able to do that. You can't open a window that closes itself when the other window is clicked. Popups do :(

you CAN close a popup window from another window when it is clicked using the following:
function doPopup(){windowOne = window.open("somepage.htm", "windowOne", define_dimensions_and_sizes_here, "_blank");openedPopup = true;}windowOne = "";openedPopup = false;

Then:

In Main window:<body onfocus="if(openedPopup){windowOne.window.close();}">In popup window:<body onclick="self.opener.openedPopup=false; window.close();">

With the object:

<input type="button" value="Testing" onmouseover="doPopup()">Or<input type="button" value="Testing" onclick="doPopup()">

Link to post
Share on other sites
  • 3 weeks later...
Zomgwthbbq?

What is the node thing? What are parent nodes? Do i need to open a new topic about this? Does anyone have a link to a tut on them? I'm so confused! :)
Link to post
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...