Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Fix css not exists error, update README.
  • Loading branch information
Ju2ender committed Oct 16, 2015
1 parent ed61d78 commit e3a98c6
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 7 deletions.
23 changes: 17 additions & 6 deletions README.md
Expand Up @@ -17,35 +17,46 @@ http://www.timo-ernst.net/misc/toastdemo/
## How to use

1) Add the script to your project (after Framework7 script!) and also add CSS reference:

```html
<link rel="stylesheet" href="toast.css">
<script src="toast.js"></script>
```

2) Create a new toast

You can create a new toast with a icon:

```javascript
var app = new Framework7();
var toast = app.toast('Marked star', '<div>☆</div>', {})
var toast = app.toast('Marked star', '<div>☆</div>', {});
```

As first parameter you set the message which gets displayed at the bottom of the toast. As 2nd parameter you have to set the icon. You can use free HTML here so set what ever you want (ASCii, Font-Icon, Images, SVG...). Third is reserved for options.

3) Now you can show or hide the box
If you just want to show a message, let 2nd parameter empty:

```javascript
// show
toast.show();
toast.show("message");
var app = new Framework7();
var toast = app.toast('A long long message', '', {});
```

or
3) Now you can show or hide the box:

```javascript
// show
toast.show();

// hide
toast.hide();
```

You can also change what message is displayed:

```javascript
toast.show("message");
```

You're done :D

Made with <3 by www.timo-ernst.net
Expand Down
1 change: 0 additions & 1 deletion example/index.html
Expand Up @@ -10,7 +10,6 @@
<!-- Path to Framework7 Library CSS-->
<link rel="stylesheet" href="lib/framework7/css/framework7.min.css">
<!-- Path to your custom app styles-->
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="../toast.css">
</head>

Expand Down

0 comments on commit e3a98c6

Please sign in to comment.