Menu
I need to position a Swal in the middle of a div. According the documentation: https://sweetalert2.github.io/
it can be done with "target" param but It's not working for me.
I have prepared the following JSFiddle to demonstrate the issue:
swal({
title: 'Hello',
target: ".myClass"
});
JSFiddle
Thanks.
468
The target param needs to be used with document.getElementById('myDiv') rather than ".myClass"
swal({
title: 'Hello',
target: document.getElementById('myDiv')
});
All the target param does is let you determine which div or element the sweetalert2 div gets appended to. The default is <body> but if you specify a div, you will still get a full screen overlay, the code is simply appended into the div of your choice.
As a work around you could provide some override CSS in your style sheet:
#myDiv .swal2-container {
position:inherit;
height:500px;
width:500px;
}
<div class="myClass" id="myDiv"></div>
But this will only work if your div is empty, as soon as you put anything in the div, the alert will be offset underneath any content.
175
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
