[Help] Toasts inside iframe #1675
-
Help WantedI'm creating an html page with Fomantic UI, using toasts. This html has to be embedded as a scrollable iframe in a wordpress page. I've noticed that when the iframe is scrolled down the top toasts are not visible as they actually show-up at the topmost of the iframe. Is there any way to make the toasts show at the top of the iframe viewport so that they are always visible no matter if the iframe is scrolled or not? Thanks |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments
-
Please provide your fiddle. So, we can reproduce it properly and see your problem. |
Beta Was this translation helpful? Give feedback.
-
An iframe has its complete own context. To accomplish your task you would have to call the toast from the iframes parent, so the whole viewport can be accessed again. // Code in iframe.js running inside iframe webpage
window.parent.showToast(); // Code in parent.js running inside webpage where the iframe is embedded
function showToast(){
$('body').toast({message: 'i was called from the iframe!'})
} The above mentioned approach does only work when the iframe and its parent share the same domain! If not, try to use window.postMessage instead |
Beta Was this translation helpful? Give feedback.
An iframe has its complete own context. To accomplish your task you would have to call the toast from the iframes parent, so the whole viewport can be accessed again.
The above mentioned approach does only work when the iframe and its parent share the same domain! If not, try to use window.postMessage instead