I'm using Magnific Popup and I would like to have a video come up as soon as the page loads in a popup.
I got the plugin to work fine, but I have no idea on how to get it to pop up as soon as the page loads, without clicking on the thumbnail.
I looked around for a solution, but I did not manage to get it to work.
I was able to get a timed modal working using jquery's setTimeout function, Just wrap . magificpopup in the settimeout function to set a delay. Change the value of 5000 (5 seconds) to whatever value you want. setTimeout will not work on server cause it will depend on internet speed.
You can use the Bootstrap . modal('show') method for launching the modal window automatically when page load without clicking anything.
1) Add MP files to your theme's directory Create the directory magnific-popup in your theme's directory. Download the MP CSS and JS files from GitHub and put both in the magnific-popup directory: jquery. magnific-popup.
If you're using jQuery you could just listen for the window load event and then call the open method for your Magnific Popup like so:
(function($) {
$(window).load(function () {
// retrieved this line of code from http://dimsemenov.com/plugins/magnific-popup/documentation.html#api
$.magnificPopup.open({
items: {
src: 'someimage.jpg'
},
type: 'image'
// You may add options here, they're exactly the same as for $.fn.magnificPopup call
// Note that some settings that rely on click event (like disableOn or midClick) will not work here
}, 0);
});
})(jQuery);
I was able to get a timed modal working using jquery's setTimeout function, Just wrap .magificpopup in the settimeout function to set a delay. Change the value of 5000 (5 seconds) to whatever value you want.
See below:
$(document).ready(function () {
setTimeout(function() {
if ($('#myModal').length) {
$.magnificPopup.open({
items: {
src: '#myModal'
},
type: 'inline'
});
}
}, 5000);
});
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