473,795 Members | 2,391 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

onmouseup isn't always triggered when mouse button is released

http://www.frostjedi.com/terra/scrip...onmouseup.html

In Firefox, if I click in the black box and then release, I get a
popup. If I click, drag the cursor, and then release, I don't.
Similarly, if I click and then release outside of the black box, I
don't get a popup, and I don't understand why.

If I comment out "document.getEl emenById("demo" ).onmousedown =
mousedown;", it works. Why would that make a difference?

Here's the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>onmoused own / onmouseup</title>
</head>

<body id="body">
<div style="backgrou nd: black; width: 50px; height: 50px" id="demo"></
div>
<script type="text/javascript">
document.body.o nmouseup = mouseup;
document.getEle menById("demo") .onmousedown = mousedown;

function mouseup() {
alert("test");
}

function mousedown() {}
</script>
</body>
</html>
Aug 26 '08 #1
11 3478
yawnmoth wrote:
If I comment out "document.getEl emenById("demo" ).onmousedown =
mousedown;", it works. Why would that make a difference?
Look very closely at it. If you need a clue:
If I comment out "document.getEl emenById("demo" ).onmousedown =
_______________ _______________ ________^______ ________

t
Aug 26 '08 #2
yawnmoth wrote:
[...]
If I comment out "document.getEl emenById("demo" ).onmousedown =
mousedown;", it works. Why would that make a difference?
Your forgot a "t".
Here's the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>onmoused own / onmouseup</title>
</head>

<body id="body">
The ID is unnecessary. Probably someone has told you that before.
<div style="backgrou nd: black; width: 50px; height: 50px" id="demo">
You should also define the foreground color, and declare everything in the
CSS rule for the `#demo' selector.
<script type="text/javascript">
document.body.o nmouseup = mouseup;
document.getEle menById("demo") .onmousedown = mousedown;
You should not be mixing proprietary and standards-compliant features (at
least not without feature test).
function mouseup() {
alert("test");
}

function mousedown() {}
Function expressions are widely supported nowadays, it does not appear
necessary to use function declarations here. Especially not when you
use the W3C DOM which AFAIK was not implemented by user agents that only
supported JavaScript versions before 1.2.
PointedEars
--
realism: HTML 4.01 Strict
evangelism: XHTML 1.0 Strict
madness: XHTML 1.1 as application/xhtml+xml
-- Bjoern Hoehrmann
Aug 26 '08 #3
On Aug 26, 11:48*am, Thomas 'PointedEars' Lahn <PointedE...@we b.de>
wrote:
yawnmothwrote:
[...]
If I comment out "document.getEl emenById("demo" ).onmousedown =
mousedown;", it works. *Why would that make a difference?

Your forgot a "t".
Yup - thanks to both you and Stevo for pointing that out!
The ID is unnecessary. *Probably someone has told you that before.
Someone has. Note that I didn't actually reference it with a
getElementById call. I just copy / pasted the HTML (I don't have the
DOCTYPE memorized, for instance) and I guess there was a redundancy I
was unaware of. Kinda like having any id that you don't use - they
could all be deleted if you noticed them.
<div style="backgrou nd: black; width: 50px; height: 50px" id="demo">

You should also define the foreground color, and declare everything in the
CSS rule for the `#demo' selector.
I think for a real live production website that's definitely a good
idea. The main point of CSS is to separate content from aesthetics -
to make it so you don't have to edit the HTML to alter the layout.

For a quick little thing like this, though, I'm not sure why it'd
matter? If you had a style tag you could even split the CSS rules for
#demo up into multiple groups which would make it a bit more difficult
for someone to see what you're doing, even though it might be more
concise...
<script type="text/javascript">
document.body.o nmouseup = mouseup;
document.getEle menById("demo") .onmousedown = mousedown;

You should not be mixing proprietary and standards-compliant features (at
least not without feature test).
For that matter, it seems like feature tests are probably worth while
for even standards-compliant code? Just because someones browser
supports JavaScript1.3 doesn't mean someone can't come along with a
browser only supporting JavaScript1.2.
function mouseup() {
* alert("test");
}
function mousedown() {}

Function expressions are widely supported nowadays, it does not appear
necessary to use function declarations here. *Especially not when you
use the W3C DOM which AFAIK was not implemented by user agents that only
supported JavaScript versions before 1.2.
I'll have to keep that in mind... thanks!
Aug 26 '08 #4
yawnmoth wrote:
Thomas 'PointedEars' Lahn wrote:
>yawnmothwrot e:
>>[...] <div style="backgrou nd: black; width: 50px; height: 50px"
id="demo">
You should also define the foreground color, and declare everything in
the CSS rule for the `#demo' selector.

I think for a real live production website that's definitely a good idea.
[...] For a quick little thing like this, though, I'm not sure why it'd
matter?
Decreasing maintenance effort.
If you had a style tag
Given that there is no such thing, what exactly do you consider a `style tag'?
you could even split the CSS rules for #demo up into multiple groups
which would make it a bit more difficult for someone to see what you're
doing, even though it might be more concise...
Your reasoning is flawed. IDs must be unique in a document.
>><script type="text/javascript"docu ment.body.onmou seup = mouseup;
document.getE lemenById("demo ").onmoused own = mousedown;
You should not be mixing proprietary and standards-compliant features
(at least not without feature test).

For that matter, it seems like feature tests are probably worth while for
even standards-compliant code?
Yes, DOM standards may not be (fully) supported, and to every implementation
of them there has to be a proprietary beginning.
Just because someones browser supports JavaScript1.3 doesn't mean someone
can't come along with a browser only supporting JavaScript1.2.
You misunderstood. This is not a matter of the programming language, but of
the APIs used with it.
PointedEars
--
Anyone who slaps a 'this page is best viewed with Browser X' label on
a Web page appears to be yearning for the bad old days, before the Web,
when you had very little chance of reading a document written on another
computer, another word processor, or another network. -- Tim Berners-Lee
Aug 26 '08 #5
On Aug 26, 4:10*pm, Thomas 'PointedEars' Lahn <PointedE...@we b.de>
wrote:
If you had a style tag

Given that there is no such thing, what exactly do you consider a `style tag'?
This?:

http://www.w3schools.com/TAGS/tag_style.asp
Aug 26 '08 #6
On Aug 26, 11:25*am, Stevo <n...@mail.inva lidwrote:
yawnmoth wrote:
If I comment out "document.getEl emenById("demo" ).onmousedown =
mousedown;", it works. *Why would that make a difference?

Look very closely at it. If you need a clue:

*If I comment out "document.getEl emenById("demo" ).onmousedown =
_______________ _______________ ________^______ ________

t
I made the change and it's still not working as expected. I add the
't' and get the same behavior as before. The only difference is that
an entry isn't added to the Error Log. And now, if I comment out
document.getEle mentById("demo" ), it doesn't make a difference.
Clicking outside of the box still doesn't do anything.

Any ideas as to why?

Thanks!
Aug 26 '08 #7
yawnmoth wrote:
Thomas 'PointedEars' Lahn wrote:
>>If you had a style tag
Given that there is no such thing, what exactly do you consider a `style tag'?

This?:

http://www.w3schools.com/TAGS/tag_style.asp
You have just said Jehova[tm]:

<http://groups.google.c om/groups?as_q=w3s chools.com&as_u group=comp.lang .javascript&sco ring=d&filter=0 >

IOW, you have chosen a poor reference; I don't understand why it is still in
the FAQ, and I strongly recommend you find a better one. Contrary to what
it states, it attempts to describe the HTML `style' element instead, with
its `<style ...>' start tag and and `</style>' end tag, which enclose, of
course, its content.

<http://www.w3.org/TR/html4/intro/sgmltut.html#h-3.2.1>

Although there is surely no shortage of evidence for that there, that your
choice has been a poor one can easily be proven in this instance: this part
of the Web site describes `xml:space' as a "standard attribute" of the "HTML
<styletag". However, HTML is a application of SGML; an `xml:space'
attribute would require namespace support which only applications of XML can
provide. And in fact, it is an attribute of the *XHTML* (1.0) `style'
element, a completely different animal.

Rest assured that the documentation and example code that you can find there
are equally flawed.
HTH

PointedEars
--
var bugRiddenCrashP ronePieceOfJunk = (
navigator.userA gent.indexOf('M SIE 5') != -1
&& navigator.userA gent.indexOf('M ac') != -1
) // Plone, register_functi on.js:16
Aug 26 '08 #8
On Aug 26, 11:57*pm, yawnmoth <terra1...@yaho o.comwrote:
>
I made the change and it's still not working as expected. *I add the
't' and get the same behavior as before. *The only difference is that
an entry isn't added to the Error Log. *And now, if I comment out
document.getEle mentById("demo" ), it doesn't make a difference.
Clicking outside of the box still doesn't do anything.

Any ideas as to why?

Thanks!
The body's height happens to be much less than the size on the window
for that .html so that clicking under/below the box isn't cliking into
the body. Click at the right side next to the box... and it works.

--Jorge.
Aug 27 '08 #9
On Aug 26, 9:29*pm, Jorge <jo...@jorgecha morro.comwrote:
On Aug 26, 11:57*pm,yawnmo th<terra1...@ya hoo.comwrote:
I made the change and it's still not working as expected. *I add the
't' and get the same behavior as before. *The only difference is that
an entry isn't added to the Error Log. *And now, if I comment out
document.getEle mentById("demo" ), it doesn't make a difference.
Clicking outside of the box still doesn't do anything.
Any ideas as to why?
Thanks!

The body's height happens to be much less than the size on the window
for that .html so that clicking under/below the box isn't cliking into
the body. Click at the right side next to the box... and it works.
That helped - thanks!

Am using document.onmous eup, instead, now.
Aug 27 '08 #10

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

Similar topics

3
10671
by: Michael Schuerig | last post by:
I'm trying to use the right mouse button to open a popup on a specific element. The popup is triggered by a mouseup event. However, on mousedown the standard context menu opens. To get around this, I listen to that event, too, and stop it (preventDefault, stopPropagation). That works on Konqueror (and presumably other KHTML-based browsers), but not on Firefox. The latter still opens its context menu. My search has turned up literally...
83
15632
by: rahul8143 | last post by:
hello, what is difference between sizeof("abcd") and strlen("abcd")? why both functions gives different output when applied to same string "abcd". I tried following example for that. #include <stdio.h> #include <string.h> void main() { char *str1="abcd";
0
1539
by: Jim H | last post by:
I'm trying to use an owner draw ListBox by subscribing to the DrawItem event to draw my custom control as an item in the ListBox. This event is triggered when I drag the scroll button but NOT when I click the up/down arrows on the scroll bar of the ListBox. How do I handle the user clicking the up/down arrows? Anybody have any ideas? Jim
4
2084
by: Dale Levesque | last post by:
I get this message. any ideas?? See the end of this message for details on invoking just-in-time (JIT) debugging instead of this dialog box. ************** Exception Text ************** System.Security.SecurityException: Request for the permission of type 'System.Security.Permissions.SecurityPermission, mscorlib, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089' failed.
4
1753
by: lesperancer | last post by:
I've got a comboBox with 2 choices and based on the choice, I make button A or button B visible if choose choice 1, button A is visible now, I undo the choice so that the comboBox is null, but button A is still visible I tried the field's onChange event, but no luck I could use the form's timer event, but I wonder if there's a better
4
9245
by: cb.brite | last post by:
Hello, I have tried this using the MouseEnter/MouseLeave events. However these events do not really refer to the rectangular shape of the form, but the client area (form area minus children areas). This means that if the mouse is currently inside the form's client area and it enters a child, a MouseLeave event will be generated on the form. One little trick to overcome this is to do a point-in-rectangle test inside the MouseLeave...
6
9726
by: marss | last post by:
Hi, How can I define in Firefox whether the left mouse button is pressed when I move mouse over a html element? The documentation says that "e.button == 0 for standard 'click', usually left button" http://developer.mozilla.org/en/docs/DOM:event.button Tracing of mouse clicks or mousedown/mouseup events looks not reliable, because mouse can be pressed elsewhere out of the html element (even outside of the browser) and then move over the...
8
3730
by: FAQ server | last post by:
----------------------------------------------------------------------- FAQ Topic - How do I disable the right mouse button? ----------------------------------------------------------------------- The oncontextmenu intrinsic event is the only safe and reliable method. Of the other approaches often presented, most depend on an alert box interrupting the process and rarely work. Note that oncontextmenu is a non-standard event and is not...
4
2502
by: yawnmoth | last post by:
I'm trying to write a script whereby the body background is changed to back (from white) when the mouse button is held down and kept held down. When you lift it up, I'd like it to change back to white. Unfortunately, I'm not sure how to do that. Any ideas? Here's my code: http://www.frostjedi.com/terra/scripts/demo/onmousedown.html Thanks!
0
9519
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10438
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
1
10164
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
9042
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7540
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
6780
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5437
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
5563
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
3
2920
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

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.