# Tourtip

![Tourtip next to a filter action button](/files/-MJmthm7eIxDpaHb3wBF)

### Introduction

Tourtip is a system-activated [popover](/mindpatterns/disclosure/popover.md). The purpose of the tourtip is to inform the user of some new feature or section on the page.

A tourtip is open by default and must be explicitly closed by the user. Once closed, it cannot be reopened.

### Working Examples

A tourtip example is in progress. Check back again soon.

Examine the required markup structure within our [Bones GitHub project](https://github.com/ianmcburnie/bones#tourtip).

View a fully style examples on our [eBay Skin website](https://opensource.ebay.com/skin/component/tourtip/).

### Terminology

**tourtip**: the composite pattern as a **whole**, containing the following sub-parts

**host**: the element that *hosts* the tourtip

**overlay**: the non-modal overlay that contains the content related to it's host

**tip**: the tip content

**expanded**: the overlay state (true or false)

### Best Practices

Overlay **must** contain a button to dismiss the tourtip.

Overlay **must** remain on screen until explicitly dismissed by user.

Overlay cannot be opened once closed without a full page refresh.

Please refer to the [popover](/mindpatterns/disclosure/popover.md) pattern for all inherited best practices.

### Interaction Design

This section provides guidance for keyboard, screen reader and pointing devices.

#### Keyboard

Please refer to the popover pattern for all inherited keyboard interactions.

#### Screen Reader

If high-priority, tourtip **must** be announced.

If high-priority, tourtip **must** be listed as a region/landmark.

Please refer to the popover pattern for all inherited screen reader interactions.

#### Pointer

Please refer to the popover pattern for all inherited pointer interactions.

### Developer Guide

This section is not yet available.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ebay.gitbook.io/mindpatterns/messaging/tourtip.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.