I can't find any right way to renew timer in toastrjs
after hovering.
I determinate a extendedTimeOut
to 0, to not close the toastr
when I hover over it.
The timeOut of toastr
is 10000 ms, but when I'm finished hovering, toastr
is immediately getting hide.
What's the right way to show a toastr
10000 ms after I'm finished hovering over it.
Example of my toastr properties:
const inboxToastr = toastr;
inboxToastr.info(data.bubbleData, title, {
"tapToDismiss": false,
"closeButton": true,
"newestOnTop": false,
"progressBar": false,
"positionClass": "toast-bottom-left", //position
"preventDuplicates": false,
"onclick": null,
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "10000",
"extendedTimeOut": "0",
"hideEasing": "linear",
"iconClass": "background-gray"
});
Using timeout 10000 and extendedTimeOut 10000 with other options to default seems to work as you expect, auto close after after 10 sec, keep shown while hovering and hide 10 sec after hovering out.
$(function() {
toastr.info("Title", 'Subtitle', {
timeOut: 10000,
extendedTimeOut: 10000,
progressBar: true
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" rel="stylesheet" />
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With