创建弹出菜单

<script> var oPopup = window.createPopup(); function richDropDown() { oPopup.document.body.innerHTML = oContextHTML.innerHTML; oPopup.show(0, 28, 305, 100, dropdowno); } function richToolTip() { var lefter = event.offsetY+0; var topper = event.offsetX+15; oPopup.document.body.innerHTML = oToolTip.innerHTML; oPopup.show(topper, lefter, 170, 120, ttip); } function richDialog() { oPopup.document.body.innerHTML = oDialog.innerHTML; oPopup.show(100, 50, 400, 300); } function richContext() { var lefter2 = event.offsetY+0; var topper2 = event.offsetX+15; oPopup.document.body.innerHTML = oContext2.innerHTML; oPopup.show(topper2, lefter2, 210, 88, contextobox); } </script> href="ms-help://Hx/HxRuntime/HxLink.css" type="text/css" rel="stylesheet" />

Four Exciting Uses of the Popup Object

1. Custom Context Menus

Context menus are accessed by clicking the right mouse button. Usually this displays a default context menu. Now you can create a customized context menu with the popup object.

Right-click inside this box.

---

2. Custom Menus

Creating custom menus is easy with the popup object. In the following example, the drop-down menu uses a gradient filter on each option and has a color scroll bar. Click the drop-down menu and then move the cursor over the options to see these effects.

Click here for a custom drop-down 

---

3. Custom Message Boxes

All types of interactive message boxes can be easily created with the popup object. Click the button below.

Click Me

---

4. Custom ToolTips

Using the popup object, web pages can now have ToolTips that are as dynamic as the pages themselves. In the following example, the popup object's position depends on where the mouse pointer is when the ToolTip is activated. Move the cursor over the green text to display a ToolTip.

Using Custom ToolTips enhance the web experience.

Custom Drop-Down Item 1

Custom Drop-Down Item 2

Custom Drop-Down Item 3

Custom Drop-Down Item 4

Custom Drop-Down Item 5

Rich Message Boxes

---

This message box is written entirely in Dynamic HTML (DHTML) using Cascading Style Sheets (CSS). You can dynamically change properties of this message box. For instance, click the button below to change the color of the popup object.


Change Color

Close Message

DHTML Content

---

It's easy to put content in a custom message box

Custom ToolTips

---

Now you can create ToolTips that are enhanced by DHTML.

Custom ToolTips

---

Now you can create ToolTips that are enhanced by DHTML.

  Home

  Search

  Intenet Explorer

©2005 Microsoft Corporation