myersjustinc/iframe_content.html

## iframe_content.html
<!doctype html>
<html>
    <head>
        <title></title>
    </head>
    <body>
        <a href="iframe_content_2.html">another page?</a>
    </body>
</html>

## iframe_content_2.html
<!doctype html>
<html>
    <head>
        <title></title>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $('#lookingglass').click(function() {
                    window.location.hash = $(this).attr('href').replace('#', '');
                });
            });
        </script>
    </head>
    <body>
        <a href="#lookingglass" id="lookingglass">click me</a>
    </body>
</html>

## index.html
<!doctype html>
<html>
    <head>
        <title></title>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $('#wrapped').load(function() {
                    try {
                        var subWindow = this.contentWindow;
                        var frameLocation = subWindow.location.href;
                        if (frameLocation) {
                            $('#frame-url').text(subWindow.location.href);
                            $(subWindow.document).ready(function() {
                                if ('onhashchange' in subWindow) {
                                    $(subWindow).bind('hashchange', function() {
                                        $('#frame-url').text(subWindow.location.href);
                                    });
                                }
                            });
                        } else {
                            // Chrome doesn't actually throw anything and just
                            // sets frameLocation to undefined, so we need to
                            // check for that and throw something (_anything_)
                            // ourselves to trigger the catch block below.
                            throw true;
                        }
                    } catch(e) {
                        $('#frame-url').text("URL unavailable due to cross-domain security restrictions");
                    }
                });

                $('#frame-options a').click(function() {
                    $('#wrapped').attr('src', $(this).attr('href'));
                    return false;
                });
            });
        </script>
    </head>
    <body>
        <p id="frame-url"></p>
        <iframe id="wrapped" src="iframe_content.html"></iframe>
        <ul id="frame-options">
            <li><a href="iframe_content.html" id="example-1">Example page 1</a></li>
            <li><a href="iframe_content_2.html" id="example-2">Example page 2</a></li>
            <li><a href="http://www.pbs.org/newshour/vote2012/map/embed/embed.php?map_module=static_maps&amp;map_view=va&amp;static_maps_type=social_security" id="example-3">Example page 3 (cross-domain)</a></li>
        </ul>
    </body>
</html>
	<!doctype html>
	<html>
	<head>
	<title></title>
	</head>
	<body>
	<a href="iframe_content_2.html">another page?</a>
	</body>
	</html>