I am trying to use jBox (by Stephan Wagner) but I can't get my modal window to display a web page. Can anyone see where I am going wrong.
$(document).ready(function() {
new jBox('Modal', {
width: 900,
height: 550,
url: 'http://www.google.com',
},
reload: 'strict'
}).open();
});
Many thanks in advance for your time.
Check out the ajax options, your code should work just fine when you use it in the ajax object: https://stephanwagner.me/jBox/options#ajax
Also, you can only use webpages that have the access control header set, check this fiddle with updated code: https://jsfiddle.net/StephanWagner/7hh5a6oc/
new jBox('Modal', {
width: 900,
height: 550,
ajax: {
url: '//www.google.com',
reload: 'strict'
}
}).open();
Following error will come up: "XMLHttpRequest cannot load https://www.google.com/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://fiddle.jshell.net' is therefore not allowed access."
So basically, webpages don't like to be loaded from unknown sources. You can always load content via ajax when it is allowed, see this fiddle which uses ajaxresponse.com: https://jsfiddle.net/StephanWagner/569y8wcp/
You can also experiment with iframes, see this fiddle about that: https://jsfiddle.net/StephanWagner/569y8wcp/2/ (We add an iframe with a webpage once the jBox is created). But again, it only works if the webpage allows to be loaded from external sources (Like my webpage: https://jsfiddle.net/StephanWagner/569y8wcp/3/)
