473,287 Members | 1,643 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,287 software developers and data experts.

iframe height problem & oncontextmenu event never triggered

Hi there,

I have an iframe which is editable (designMode = "on") and want to
resize it dynamically as the content grows (e.g. more lines of text is
in there) and there the struggle starts.

I fill the iframe with content (<body> tag and so on and also insert a
<div> tag, inbetween is the content that should be modified).

Now if the event "overflow" or "underflow" is triggered the iframe
resizes. I extract the offsetHeight of the <div> layer inside the
iframe and set the height of the iframe to that height. It seems to
work, but only if I add to the <body> of the iframe a border: 1px
dashed. and only if the scrollbar is activated (scrollbar="auto|yes"
of the iframe).
I dont't want to see the ugly scrollbar, so I add 2px additional on
the iframe.height. Then the iframe grows as expected, but the
shrinking doesn't work if the height was mofidied with " + 2". My
code:

function resizeEditArea() {
newHeight = iFrame.contentWindow.document.getElementById("cont ent").offsetHeight;
iFrame.height = newHeight;
// iFrame.height = "" + (newHeight + 2);
/* this scales up, but not down the iframe, problem is, that the event
"underflow" is never triggered
*/
return false;
}

The iframe is created in this way:

iFrame = document.getElementById("editArea");
iFrame.height = editAreaHeight;
iFrame.width = editAreaWidth;
// iFrame.scrolling = "no"; must be enabled otherwise no event is
triggered

editArea = iFrame.contentWindow.document;
iFrame.contentWindow.addEventListener("overflow", resizeEditArea,
false);
iFrame.contentWindow.addEventListener("underflow", resizeEditArea,
false);
// iFrame.contentWindow.addEventListener("onscroll",
resizeEditArea, false); has no impact
iFrame.contentWindow.addEventListener("oncontextme nu", mouseClick,
false);
editArea.write(doc);
resizeEditArea();
editArea.close();
editArea.designMode = "On";
iFrame.contentWindow.focus();

Can anyone help?
Thomas

Another question is: Why is the event "oncontextmenu" never triggered,
if I click the right mouse button in the iframe?
Jul 20 '05 #1
4 7556
Look at my script:

http://djwice.com/contextmenu.html

I made an IFRAME contextmenu that dynamically changes size and that is
always on top of all elements. The functions in the contextmenu are browser
dependend.
MSIE als works with the + and - on the Num/Lock part of you keyboard.

It needs testing in Mozilla, tested in MSIE 5+ and NN 7.

Wouter
"Thomas" <ts********@hotmail.com> wrote in message
news:77*************************@posting.google.co m...
: Hi there,
:
: I have an iframe which is editable (designMode = "on") and want to
: resize it dynamically as the content grows (e.g. more lines of text is
: in there) and there the struggle starts.
:
: I fill the iframe with content (<body> tag and so on and also insert a
: <div> tag, inbetween is the content that should be modified).
:
: Now if the event "overflow" or "underflow" is triggered the iframe
: resizes. I extract the offsetHeight of the <div> layer inside the
: iframe and set the height of the iframe to that height. It seems to
: work, but only if I add to the <body> of the iframe a border: 1px
: dashed. and only if the scrollbar is activated (scrollbar="auto|yes"
: of the iframe).
: I dont't want to see the ugly scrollbar, so I add 2px additional on
: the iframe.height. Then the iframe grows as expected, but the
: shrinking doesn't work if the height was mofidied with " + 2". My
: code:
:
: function resizeEditArea() {
: newHeight =
iFrame.contentWindow.document.getElementById("cont ent").offsetHeight;
: iFrame.height = newHeight;
: // iFrame.height = "" + (newHeight + 2);
: /* this scales up, but not down the iframe, problem is, that the event
: "underflow" is never triggered
: */
: return false;
: }
:
: The iframe is created in this way:
:
: iFrame = document.getElementById("editArea");
: iFrame.height = editAreaHeight;
: iFrame.width = editAreaWidth;
: // iFrame.scrolling = "no"; must be enabled otherwise no event is
: triggered
:
: editArea = iFrame.contentWindow.document;
: iFrame.contentWindow.addEventListener("overflow", resizeEditArea,
: false);
: iFrame.contentWindow.addEventListener("underflow", resizeEditArea,
: false);
: // iFrame.contentWindow.addEventListener("onscroll",
: resizeEditArea, false); has no impact
: iFrame.contentWindow.addEventListener("oncontextme nu", mouseClick,
: false);
: editArea.write(doc);
: resizeEditArea();
: editArea.close();
: editArea.designMode = "On";
: iFrame.contentWindow.focus();
:
: Can anyone help?
: Thomas
:
: Another question is: Why is the event "oncontextmenu" never triggered,
: if I click the right mouse button in the iframe?
Jul 20 '05 #2
About the height problem:

MSIE counts the border as outside the body.
NN/Mozilla counts the border as inside the body.

So if you have a border of 1px, MSIE asks you to add 2 pixels in height.
other browsers will show 2 lines below your border if you do that.
An other thing I found;
If you change focus in NN to a child, the events that you catched in the
parent will not be handled after that change via your function but via the
normal event handling of the browser.

so:

oncontextmenu=New function("child.focus();return false;");

will focus your child AND will open the browsers default contextmenu in NN
(not in IE).
Wouter
"Thomas" <ts********@hotmail.com> wrote in message
news:77*************************@posting.google.co m...
: Hi there,
:
: I have an iframe which is editable (designMode = "on") and want to
: resize it dynamically as the content grows (e.g. more lines of text is
: in there) and there the struggle starts.
:
: I fill the iframe with content (<body> tag and so on and also insert a
: <div> tag, inbetween is the content that should be modified).
:
: Now if the event "overflow" or "underflow" is triggered the iframe
: resizes. I extract the offsetHeight of the <div> layer inside the
: iframe and set the height of the iframe to that height. It seems to
: work, but only if I add to the <body> of the iframe a border: 1px
: dashed. and only if the scrollbar is activated (scrollbar="auto|yes"
: of the iframe).
: I dont't want to see the ugly scrollbar, so I add 2px additional on
: the iframe.height. Then the iframe grows as expected, but the
: shrinking doesn't work if the height was mofidied with " + 2". My
: code:
:
: function resizeEditArea() {
: newHeight =
iFrame.contentWindow.document.getElementById("cont ent").offsetHeight;
: iFrame.height = newHeight;
: // iFrame.height = "" + (newHeight + 2);
: /* this scales up, but not down the iframe, problem is, that the event
: "underflow" is never triggered
: */
: return false;
: }
:
: The iframe is created in this way:
:
: iFrame = document.getElementById("editArea");
: iFrame.height = editAreaHeight;
: iFrame.width = editAreaWidth;
: // iFrame.scrolling = "no"; must be enabled otherwise no event is
: triggered
:
: editArea = iFrame.contentWindow.document;
: iFrame.contentWindow.addEventListener("overflow", resizeEditArea,
: false);
: iFrame.contentWindow.addEventListener("underflow", resizeEditArea,
: false);
: // iFrame.contentWindow.addEventListener("onscroll",
: resizeEditArea, false); has no impact
: iFrame.contentWindow.addEventListener("oncontextme nu", mouseClick,
: false);
: editArea.write(doc);
: resizeEditArea();
: editArea.close();
: editArea.designMode = "On";
: iFrame.contentWindow.focus();
:
: Can anyone help?
: Thomas
:
: Another question is: Why is the event "oncontextmenu" never triggered,
: if I click the right mouse button in the iframe?
Jul 20 '05 #3
"DJ WIce" <contextmenu @ djwice.com> wrote in message news:<bv**********@news.tudelft.nl>...
About the height problem:

MSIE counts the border as outside the body.
NN/Mozilla counts the border as inside the body.

So if you have a border of 1px, MSIE asks you to add 2 pixels in height.
other browsers will show 2 lines below your border if you do that.
An other thing I found;
If you change focus in NN to a child, the events that you catched in the
parent will not be handled after that change via your function but via the
normal event handling of the browser.

so:

oncontextmenu=New function("child.focus();return false;");

will focus your child AND will open the browsers default contextmenu in NN
(not in IE).
Wouter


Thank you, I didn't know of this function. But I definitely want to
open my own context menu on the right mouse click. Right now, only the
browser menu opens. And still the iframe doesn't trigger oncontextmenu
at all.
Jul 20 '05 #4
: Thank you, I didn't know of this function. But I definitely want to
: open my own context menu on the right mouse click. Right now, only the
: browser menu opens. And still the iframe doesn't trigger oncontextmenu
: at all.

So look at the code at my website.. :-)

Wouter
Jul 20 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
by: Martial Spirit | last post by:
Hello- I was amazed at the suckerfish drop-downs from AListApart.com. They work great except for one thing, if I position the drop-downs over an iframe element, on mouseover the menus disappear....
0
by: Giuseppe | last post by:
Hi I've this problem Inside a winform application I've put a "webbrowser" control I've tried to catch the oncontextmenu event of the loaded HTML document with the following approach 1) In...
26
by: shlomi.schwartz | last post by:
using this example: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Test Page</title> </head>
3
by: Asterbing | last post by:
Since the "on fly addition..." thread has taken another direction, I'm opening a new one to be more explicit and recenter the subject. Well, the subject is to detect when a document is well...
4
by: lefrison | last post by:
Hi i am generating a div in my window which moves with my cursor on the screen. this works fine until i try to move the cursor over an iframe in the window. if i use the z-index the div moves in...
10
by: Chris Tomlinson | last post by:
Hi all, just a quickie. I hope someone has the answer. We have about 30 images on a page, and want to apply something like this to all of them: < ... oncontextmenu="alert('Message...
2
riptide2049
by: riptide2049 | last post by:
I really have a problem here. I have a code that is suppost to take the href of a link from the right class;value of a link maked toreturn false. the value is a Media file the file is sent to...
3
polymorphic
by: polymorphic | last post by:
I have succeeded in embedding PDF files in a dynamic iframe. The problem is that I need the PDF to cache. If the PDF remains the same from page load to page load then the pdf is somehow cached with...
0
by: MeoLessi9 | last post by:
I have VirtualBox installed on Windows 11 and now I would like to install Kali on a virtual machine. However, on the official website, I see two options: "Installer images" and "Virtual machines"....
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.