[2 days left] What’s wrong with your cloud strategy? Learn why multicloud solutions matter with Nimble Storage.Register Now

x
?
Solved

Browser response to mouse events

Posted on 2013-01-18
7
Medium Priority
?
377 Views
Last Modified: 2013-01-24
I've been poking around inside the TinyMCE editor code and I notice that after I insert an image into the text area I can mousedown on the image and four handles appear around the image.  I've searched all  through the TinyMCE source for where these handles are added and I've come to the conclusion that TinyMCE doesn't add them.  It appears that the browser sends the mousedown event to TinyMCE, TinyMCE does what it needs to do with the event and then exits, passing control back to the browser, and only then do the handles appear.  So it looks like the browser is adding these handles, not TinyMCE.

First, can anyone verify that this is indeed what happens: the browser is adding the handles.

Second, browsers don't always add handles when you click an image on a page that it's loaded,  so when do browsers behave this way?  Does the browser have to be put into a certain mode to exhibit this behavior?

Third, when you hover over one of these handles the cursor changes to a two-head arrow, inviting you to drag that side to resize the image.  Is this also being done by the browser?

Thanks for any info on these questions.  And any pointers to documents that talk about what browsers are able to do in response to mouse events would be most helpful.

Thanks,
Steve
0
Comment
Question by:steva
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
7 Comments
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 38795619
The first question is... Which Browser?  They are not identical and don't always act the same.  Open the page in a different browser and see if it still happens there.
0
 

Author Comment

by:steva
ID: 38795801
I was using Firefox 18.0, but IE9 is the same.  Safari and Chrome are a bit different: the handles appear on the mouseup instead of the mousedown. (This pretty much proves that it's the browser that brings up the handles since the same TinyMCE code is running in all cases but two different behaviors are seen.)

In all cases the browser lets you click the image to bring up handles and then lets you drag a handle to resize the image.  Where is it documented that browsers must do this?

What else do browsers do on their own in response to mouse events, and where is this all documented?

Thanks
0
 
LVL 84

Accepted Solution

by:
Dave Baldwin earned 1500 total points
ID: 38795907
I doubt that it is documented and I doubt that they 'have to'.  The different browsers do try to keep up with each other.  But there are a lot of behaviors that are not part of any written standard.  IE uses a different font rendering engine than the others do.  Each browser has it's own implementation of javascript and though there is an extensive standard for that, they still aren't 100% exactly the same.  Javascript is where the 'mouse events' or at least the actions started by them are handled.
0
On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

 

Author Closing Comment

by:steva
ID: 38816547
Dave,

I didn't really see an answer in what you wrote, but no one else wrote anything at all, so I'll give you the points for the thoughts.
0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 38816910
Thanks for the points.  You can always click on "Request Attention" above to get others to look at your question.
0
 

Author Comment

by:steva
ID: 38817304
Oh!  I thought that got the attention of the moderator.

By the way, I did find some information.  Mozilla has a paper at https://developer.mozilla.org/en-US/docs/Rich-Text_Editing_in_Mozilla.

Basically, if you turn on designMode for a document you get things like handles around images for resizing. It also exposes the execCommand() method for the document which lets you request that the browser do things like bold or italicize selected text.  There's also a contentEditable attribute you can set for elements, that just makes those editable.

As you said, not everyone implements it the same, but they all make an effort.
0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 38817546
Yes, it gets the attention of the moderator and you can ask them to send out requests for more experts.

Glad you found some of what you were looking for.
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I annotated my article on ransomware somewhat extensively, but I keep adding new references and wanted to put a link to the reference library.  Despite all the reference tools I have on hand, it was not easy to find a way to do this easily. I finall…
Ever visit a website where you spotted a really cool looking Font, yet couldn't figure out which font family it belonged to, or how to get a copy of it for your own use? This article explains the process of doing exactly that, as well as showing how…
This Micro Tutorial will demonstrate how to add subdomains to your content reports. This can be very importing in having a site with multiple subdomains.
Want to learn how to record your desktop screen without having to use an outside camera. Click on this video and learn how to use the cool google extension called "Screencastify"! Step 1: Open a new google tab Step 2: Go to the left hand upper corn…

656 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question