I'm brand new to javascript, and not surprised to be having an issue. Here's my userscript:
// ==UserScript==
// @name Open Modal-External Page-Iframe
// @version 0.1
// @match http://barackobamaisyournewbicycle.com/
// @require http://code.jquery.com/jquery-latest.js
// @require https://simplemodal.googlecode.com/files/jquery.simplemodal-1.4.4.js
// ==/UserScript==
$(document).ready(function() {
$('body').append('<input type="button" value="test-modal-button" id="CP">');
$("#CP").css("position", "fixed").css("top", 25).css("left", 0);
$('#CP').click(function(){
alert('testmodal');
var src = "http://365.ericmmartin.com/";
$.modal('<iframe src="' + src + '" height="450" width="830" style="border:0">', {
closeHTML:"",
containerCss:{
backgroundColor:"#fff",
borderColor:"#fff",
height:450,
padding:0,
width:830
},
overlayClose:true
});
});
});
the issue
When I navigate to http://barackobamaisyournewbicycle.com, I see my button [test-modal-button] on the top left and when I click, the modal window appears, but http://365.ericmartin.com/ does not load in that modal window, and the modal window remains blank. Just now I put an alert('testmodal'); statement in between, so that I know I am reaching that code when the button is clicked, but that's just for debugging purposes.
I pulled this example straight from
http://www.ericmmartin.com/projects/simplemodal/
at
"// Display an external page using an iframe"; about 3/4 of the way down the page.
EDIT:
I changed the @match website for this question to the simplest webpage I could find, but then actually tried it on barackobamaisyournewbicycle.com and it started working. Must have something to do with the other site I was testing it out on? Although that doesn't make much sense to me. Since I've already put some effort into the question, are there any suggestions to improve my implementation?
