First of all thanks for the multiple updates you did on this template. I'm on the 4.6 right now, stunning.
But I face a problem with the toasts.
I use a autohiding toast and the autohide is quite chaotic (same on the demo). Nevermind the delay, the toast never hide at the same time. For what I saw it depends on the mouse activity (if I move the mouse out and in the window it hides faster than if I don't move a lot. If the mouse is not moving at all .... the toast never disappear.
Any idea how to get the "normal" behaviour on this one?
Hi mate, I found a quick solution for autoHide toast, We need to call the toast separately with specific ID copy and paste the below code into the bottom of page you want to auto show/hide taost
//Auto Hide var toastAutoHide = document.getElementById('autoHideToast') if (toastAutoHide) { var toast = new bootstrap.Toast(toastAutoHide) toast.show() }
Currently error showing because we directly add the show class into toast component,
Dont't foget to add the ID to the related toast like using above js code - <div class="toast fade" id="autoHideToast">...</div>
This is the better way of auto show/hide taost without having any issue, I use id instead of class because we mostly have 1 or 2 toast per page
Also i will add this code into theme.bundle.js for a separate auto show/hide toast
Hope you got your answer!
Feel free to ask any question, any time, I will be glad to help you!
Toasts don't want to hide
First of all thanks for the multiple updates you did on this template.
I'm on the 4.6 right now, stunning.
But I face a problem with the toasts.
I use a autohiding toast and the autohide is quite chaotic (same on the demo).
Nevermind the delay, the toast never hide at the same time. For what I saw it depends on the mouse activity (if I move the mouse out and in the window it hides faster than if I don't move a lot. If the mouse is not moving at all .... the toast never disappear.
Any idea how to get the "normal" behaviour on this one?
Thanks in advance
Last edited 2 years ago
Thanks for choosing Assan Theme!
Thanks for reporting the issue,
I will look into this and fix it with upcoming admin RTL and new landing demo update
Best regards
Rakesh
I found a quick solution for autoHide toast,
We need to call the toast separately with specific ID
copy and paste the below code into the bottom of page you want to auto show/hide taost
//Auto Hide
var toastAutoHide = document.getElementById('autoHideToast')
if (toastAutoHide) {
var toast = new bootstrap.Toast(toastAutoHide)
toast.show()
}
Currently error showing because we directly add the show class into toast component,
Dont't foget to add the ID to the related toast
like using above js code - <div class="toast fade" id="autoHideToast">...</div>
This is the better way of auto show/hide taost without having any issue, I use id instead of class because we mostly have 1 or 2 toast per page
Also i will add this code into theme.bundle.js for a separate auto show/hide toast
Hope you got your answer!
Feel free to ask any question, any time, I will be glad to help you!
Stay tuned for amazing future updates!
Best regards!
Rakesh
I tried your solution. Sadly doesn't work, I got a "bootstrap is not defined" error.
I tried with importing bootstrap.js but it makes a complete mess with a lot of things probably in conflict with the bungle js of the theme.
Regards
My bad, Apologies
Above code need to be put into js/bootstrap.custom.js (Not into bottom of html page), Then run gulp command to compile code into bootstrap.bundle.js!
Send me an email here - mylifedesign143@gmail.com
I will assist you and will discuss more about it!
Waiting for your email!
Thanks!
Thank you very much for your work and your support, really appreciated.
Have a lovely day
Feel free to ask any questions.
Stay tuned for future updates.
Regards