Iframe, jquery keypress

Question

I would like to know why my code does not work , any help appreciated.

I want to apply the following css to an Iframe when I hit the escape key, when the dynamically loaded from the same domain (its on the server, not on a remote server) iframe has the focus.

        $("document").on("keyup", $('#tiny-iframe').contentWindow.document , (function(e) {
            if (e.keyCode == 27) {
                    $('#full-pres, #tiny-iframe').css({
                            "width": "400px",
                            "min-width": "350px",
                            "position": "relative",
                            "height":"240px"
                    });
            }
        });

This HTML is the iframe html:

            <!doctype html>
              <html>
            <head>
                <meta name='viewport' content='width=1024'/>   
                <title>Presentation Impress</title>
                <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'> 
                <style> p {font-size:70px;}
                </style>
            </head>
            <body>  
                 <div id='jmpress'>
                  <div id='impress'>
                    <div id='first' class='step ' data-x='0' data-y='0'>
                     <p >Première acétate. </p>
                    </div>
                  </div>
                 </div>
        <script type='text/javascript' src='/static/javascripts/impress.js'> </script>     
                <script>impress().init();</script>
            </body>
        </html>

goes in a div#tiny-iframe which is in a div#full-pres in my main html page. The code above is loaded via ajax.

THIS POST

How to expose IFrame's DOM using jQuery? was very helpfull.

Can you explain why you use an iframe at all? Can't you call an URL that returns partial HTML that contains the data you need displayed? — Matthew Perron, Jul 15 '13 at 19:37
Try using a div instead of an iframe. There must be a way to tell impress.js to do its work on a container div. See this post : https://github.com/bartaz/impress.js/issues/111 — Matthew Perron, Jul 15 '13 at 19:40

score 0 · Answer 1 · answered Jul 15 '13 at 19:07

0

You can only do what you are trying to do if the iFrame is in the same domain.

Otherwise the browser will prevent it.

answered Jul 15 '13 at 19:07

Naftali

144,921
39
244
303

It is not on a remote domain. – Maxime G Jul 15 '13 at 19:18
huh ? I got it in ajax from my own server , the same who provides the web page containing this script. – Maxime G Jul 15 '13 at 19:24
@MaximeG what does your HTML look like? – Naftali Jul 15 '13 at 19:25
@Maxime G Why do you use an iframe at all? Why not use a div? See $("#target-div").load(url) (http://api.jquery.com/load/) – Matthew Perron Jul 15 '13 at 19:34
Because I have to if I don't want the presentation element to fly by my main page (when the presentation is smaller (in the main page, not fullscreen)). – Maxime G Jul 15 '13 at 19:36
Do you think it can do what I need ? – Maxime G Jul 15 '13 at 19:40

Iframe, jquery keypress

1 Answers1