136 lines
3.1 KiB
Markdown
136 lines
3.1 KiB
Markdown
# BSToast4
|
|
|
|
## Usage
|
|
|
|
This is the usage guide for **BSToast4**, version **0.2.0.059**.
|
|
|
|
---
|
|
|
|
## `Create(options)`
|
|
|
|
Creates a Toast on the page. The default position is the **top-right**.
|
|
|
|
### Options
|
|
|
|
```javascript
|
|
{
|
|
Icon: "",
|
|
Title: "",
|
|
Time: "",
|
|
Message: "",
|
|
Footer: "",
|
|
Animation: true,
|
|
AutoHide: true,
|
|
Delay: 6000,
|
|
Position: "position:fixed; top:0; right:80px; margin:20px;",
|
|
MinWidth: 320,
|
|
MinHeight: 100,
|
|
HeaderClass: "bg-light",
|
|
FooterClass: "bg-light text-center"
|
|
}
|
|
```
|
|
|
|
### Parameters
|
|
|
|
| Name | Type | Description |
|
|
|------|------|-------------|
|
|
| `Icon` | `html` | HTML for the top-left image. |
|
|
| `Title` | `string` | Label shown at the top of the toast. |
|
|
| `Time` | `string` | Text displayed at the top-right of the toast, typically the time. |
|
|
| `Message` | `string` | HTML body of the toast. |
|
|
| `Footer` | `string` | HTML body of the toast footer. |
|
|
| `Animation` | `bool` | Whether the toast opens with an animation. |
|
|
| `AutoHide` | `bool` | Whether the toast automatically closes after a delay. |
|
|
| `Delay` | `int` | Delay before automatically closing the toast, in milliseconds. |
|
|
| `Position` | `css` | CSS defining the toast container position. |
|
|
| `MinWidth` | `int` | Minimum width of the toast. |
|
|
| `MinHeight` | `int` | Minimum height of the toast. |
|
|
| `HeaderClass` | `css class` | CSS class applied to the toast header. |
|
|
| `FooterClass` | `css class` | CSS class applied to the toast footer. |
|
|
|
|
### Example
|
|
|
|
```javascript
|
|
BSToast4.Create({
|
|
Icon: "",
|
|
Title: "Hello Toast",
|
|
Time: "Now",
|
|
Message: "Hello",
|
|
Footer: "Footer",
|
|
Animation: true,
|
|
AutoHide: true,
|
|
Delay: 6000,
|
|
Position: "position:fixed; top:0; right:80px; margin:20px;",
|
|
MinWidth: 320,
|
|
MinHeight: 100,
|
|
HeaderClass: "bg-light",
|
|
FooterClass: "bg-light text-center"
|
|
});
|
|
```
|
|
|
|
---
|
|
|
|
## `Push(options)`
|
|
|
|
Creates a new toast or appends a toast to the existing toast stack.
|
|
|
|
### Options
|
|
|
|
```javascript
|
|
{
|
|
Icon: "",
|
|
Title: "",
|
|
Time: "",
|
|
Message: "",
|
|
Footer: "",
|
|
Animation: true,
|
|
AutoHide: true,
|
|
Delay: 6000,
|
|
MinWidth: 320,
|
|
MinHeight: 100
|
|
}
|
|
```
|
|
|
|
### Parameters
|
|
|
|
| Name | Type | Description |
|
|
|------|------|-------------|
|
|
| `Icon` | `html` | HTML for the top-left image. |
|
|
| `Title` | `string` | Label shown at the top of the toast. |
|
|
| `Time` | `string` | Text displayed at the top-right of the toast, typically the time. |
|
|
| `Message` | `string` | HTML body of the toast. |
|
|
| `Footer` | `string` | HTML body of the toast footer. |
|
|
| `Animation` | `bool` | Whether the toast opens with an animation. |
|
|
| `AutoHide` | `bool` | Whether the toast automatically closes after a delay. |
|
|
| `Delay` | `int` | Delay before automatically closing the toast, in milliseconds. |
|
|
| `MinWidth` | `int` | Minimum width of the toast. |
|
|
| `MinHeight` | `int` | Minimum height of the toast. |
|
|
|
|
### Example
|
|
|
|
```javascript
|
|
BSToast4.Create({
|
|
Icon: "",
|
|
Title: "Hello Toast (2)",
|
|
Time: "Now",
|
|
Message: "Hello again",
|
|
Footer: "",
|
|
Animation: true,
|
|
AutoHide: true,
|
|
Delay: 6000,
|
|
MinWidth: 320,
|
|
MinHeight: 100
|
|
});
|
|
```
|
|
|
|
---
|
|
|
|
## `Clear()`
|
|
|
|
Closes all toasts currently displayed on the page.
|
|
|
|
### Example
|
|
|
|
```javascript
|
|
BSToast4.Clear();
|
|
``` |