How To Tell What is Clicked in a WebBrowser Control

• Download source - 13.83 KB

Introduction

This is my first submission. It is small and will be useful for beginners.

This article will demonstrate how you can tell what is selected under the cursor inside a WebBrowser control, using your own custom ContextMenu. Have you ever wanted to replace the default Internet Explorer ContextMenu? This should help you fully achieve that goal.

Background

I am currently writing a WebBrowser application for kids. Everything worked great, and I assumed I was near completion... except for that pesky - clearly Internet Explorer - ContextMenu.

Getting a custom ContextMenu to work is not the focus of this article, as it is accomplished in a few easy steps. The focus of this article is being able to provide functionality close to what Internet Explorer presents, by providing the user with a different menu for different elements on the page. 

For example, "Save Picture" when an image is clicked, or "Copy Shortcut" when a link is clicked. 

Using the Code 

I have included a sample project of what I will outline here.

First off, we need to translate the mouse coordinates on the screen, into a Point object:

Point ScreenCoord = new Point(MousePosition.X, MousePosition.Y); 

Now, we must create the coordinates of the browser, based off the coordinates of the screen:

Point BrowserCoord = webBrowser1.PointToClient(ScreenCoord);

Now we can use the WebBrowser documents GetElementFromPoint method to retrieve the element that has been clicked:

HtmlElement elem = webBrowser1.Document.GetElementFromPoint(BrowserCoord);

Now, we can use this element to see what has been clicked:

switch (elem.TagName)
{
    case "A":
        //! We have clicked a link
        break;
    case "IMG":
        //! We have clicked an image
        break;
    default:
        //! This is anywhere else
        break;
}

Points of Interest

I pulled my hair out for a fairly long time searching for a way to do this. I couldn't find anything, even here on The Code Project. So I figured this would be helpful for some people. Note that once you have the element, you can do anything with it, for example, using GetAttribute to retrieve the SRC of an image to download it, etc.

History

• 1/7/09 - First submission - all that's needed, to be honest!
• 1/8/09 - Attempted to clarify the goal of the article