Skip to content

Instantly share code, notes, and snippets.

@kraftner
Last active January 26, 2016 10:13

Revisions

  1. kraftner revised this gist Jan 26, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion index.html
    Original file line number Diff line number Diff line change
    @@ -32,7 +32,7 @@

    <body>
    <div id="back">back</div>
    <iframe id="iframe" src="http://bl.ocks.org/kraftner/raw/fb2d46bb21b91592bea5/"></iframe>
    <iframe id="iframe" src="http://bl.ocks.org/kraftner/raw/d59ff5f45d8d178cf5e7/"></iframe>
    <div id="top">TOP</div>
    <script>
    var el = document.getElementById("top");
  2. kraftner revised this gist Jan 22, 2016. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -32,12 +32,12 @@

    <body>
    <div id="back">back</div>
    <iframe id="iframe" src="http://bl.ocks.org/kraftner/raw/fea754a3dd36df736403/"></iframe>
    <iframe id="iframe" src="http://bl.ocks.org/kraftner/raw/fb2d46bb21b91592bea5/"></iframe>
    <div id="top">TOP</div>
    <script>
    var el = document.getElementById("top");
    el.addEventListener("click", function( event ) {
    console.log('iframe'+Math.random());
    console.log('outside'+Math.random());
    }, false);

    </script>
  3. kraftner revised this gist Jan 22, 2016. 1 changed file with 28 additions and 16 deletions.
    44 changes: 28 additions & 16 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -1,29 +1,41 @@
    <!DOCTYPE html>
    <head>
    <meta charset="utf-8">
    <style class="cp-pen-styles">#all {
    width: 100vw;
    height: 100vh;
    }

    #top {
    position:fixed;
    top:300px;
    left:300px;
    background-color:red;
    width:300px;
    height:300px;
    }
    <style class="cp-pen-styles">
    #back {
    width: 100vw;
    height: 100vh;
    }

    #iframe {
    position:fixed;
    top:300px;
    left:300px;
    background-color:red;
    width:300px;
    height:300px;
    }

    #top {
    position:fixed;
    top:350px;
    left:350px;
    width:100px;
    height:100px;
    }


    </style>


    </head>

    <body>
    <div id="all">back</div>
    <iframe id="top" src="http://bl.ocks.org/kraftner/raw/fea754a3dd36df736403/"></iframe>
    <div id="back">back</div>
    <iframe id="iframe" src="http://bl.ocks.org/kraftner/raw/fea754a3dd36df736403/"></iframe>
    <div id="top">TOP</div>
    <script>
    var el = document.getElementById("all");
    var el = document.getElementById("top");
    el.addEventListener("click", function( event ) {
    console.log('iframe'+Math.random());
    }, false);
  4. kraftner revised this gist Jan 22, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion index.html
    Original file line number Diff line number Diff line change
    @@ -7,7 +7,7 @@
    }

    #top {
    position:absolute;
    position:fixed;
    top:300px;
    left:300px;
    background-color:red;
  5. kraftner revised this gist Jan 22, 2016. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -20,14 +20,14 @@
    </head>

    <body>
    <div id="all">back</div>
    <iframe id="top" src="http://bl.ocks.org/kraftner/raw/fea754a3dd36df736403/"></iframe>
    <script>
    var el = document.getElementById("all");
    el.addEventListener("click", function( event ) {
    console.log('iframe'+Math.random());
    }, false);

    </script>
    <div id="all">back</div>
    <iframe id="top" src="http://bl.ocks.org/kraftner/raw/fea754a3dd36df736403/"></iframe>
    </body>
    </html>
  6. kraftner revised this gist Jan 22, 2016. 1 changed file with 13 additions and 14 deletions.
    27 changes: 13 additions & 14 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -2,20 +2,19 @@
    <head>
    <meta charset="utf-8">
    <style class="cp-pen-styles">#all {
    width: 100vw;
    height: 100vh;
    }

    #top {
    position:absolute;
    top:300px;
    left:300px;
    background-color:red;
    width:300px;
    height:300px;
    }

    </style>
    width: 100vw;
    height: 100vh;
    }

    #top {
    position:absolute;
    top:300px;
    left:300px;
    background-color:red;
    width:300px;
    height:300px;
    }
    </style>


    </head>
  7. kraftner revised this gist Jan 22, 2016. 1 changed file with 30 additions and 6 deletions.
    36 changes: 30 additions & 6 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -1,10 +1,34 @@
    <!DOCTYPE html>
    <meta charset="utf-8">
    <head>
    <meta charset="utf-8">
    <style class="cp-pen-styles">#all {
    width: 100vw;
    height: 100vh;
    }

    #top {
    position:absolute;
    top:300px;
    left:300px;
    background-color:red;
    width:300px;
    height:300px;
    }

    </style>


    </head>

    <body>
    <script>
    document.getElementsByTagName("body")[0].addEventListener("click", function( event ) {
    console.log('iframe');
    // display the current click count inside the clicked div
    event.target.innerHTML = "click count: " + event.detail;
    var el = document.getElementById("all");
    el.addEventListener("click", function( event ) {
    console.log('iframe'+Math.random());
    }, false);
    </script>

    </script>
    <div id="all">back</div>
    <iframe id="top" src="http://bl.ocks.org/kraftner/raw/fea754a3dd36df736403/"></iframe>
    </body>
    </html>
  8. kraftner revised this gist Jan 22, 2016. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion index.html
    Original file line number Diff line number Diff line change
    @@ -2,7 +2,7 @@
    <meta charset="utf-8">
    <body>
    <script>
    document.getElementsByTagName("body").addEventListener("click", function( event ) {
    document.getElementsByTagName("body")[0].addEventListener("click", function( event ) {
    console.log('iframe');
    // display the current click count inside the clicked div
    event.target.innerHTML = "click count: " + event.detail;
  9. kraftner created this gist Jan 22, 2016.
    10 changes: 10 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,10 @@
    <!DOCTYPE html>
    <meta charset="utf-8">
    <body>
    <script>
    document.getElementsByTagName("body").addEventListener("click", function( event ) {
    console.log('iframe');
    // display the current click count inside the clicked div
    event.target.innerHTML = "click count: " + event.detail;
    }, false);
    </script>