If you want to check out the code for this example, head over to jsfiddle at this link.
And below is a snippet of the HTML file:
<!DOCTYPE html>
<html>
<head>
<script src="http://www.jacklmoore.com/colorbox/jquery.colorbox.js" type="text/javascript" ></script>
<link rel="stylesheet" href="http://www.jacklmoore.com/colorbox/example4/colorbox.css" type="text/css" media="screen"/>
<script type="text/javascript">
$(document).ready(function () {
$("#test").click(function () { //on clicking the link above
$(this).colorbox({iframe:true, width:"100%", height:"100%"});
});
});
</script>
</head>
<body>
<h3>External Form</h3>
<a href="https://dev88.wufoo.com/forms/ze7xusq0j2tum9/" id="test">Please fill out my form.</a>
</body>
</html>
While the functionality works fine on jsfiddle, it seems to encounter issues when running on localhost with the HTML file. Any insights on what might be causing this discrepancy would be greatly appreciated!