{"id":3766,"date":"2017-06-09T15:53:09","date_gmt":"2017-06-09T07:53:09","guid":{"rendered":"http:\/\/blog.hoyo.idv.tw\/?p=3766"},"modified":"2018-07-24T10:15:15","modified_gmt":"2018-07-24T02:15:15","slug":"%e7%b6%b2%e9%a0%81%e6%98%af%e5%90%a6%e4%bd%9c%e7%94%a8%e4%b8%ad","status":"publish","type":"post","link":"https:\/\/blog.hoyo.idv.tw\/?p=3766","title":{"rendered":"\u7db2\u9801\u6216\u7db2\u9801\u5167\u5143\u7d20\u662f\u5426\u4f5c\u7528\u4e2d (\u53ef\u8996)"},"content":{"rendered":"<ul>\n<li><a href=\"https:\/\/stackoverflow.com\/questions\/7389328\/detect-if-browser-tab-has-focus\">Detect If Browser Tab Has Focus<\/a><\/li>\n<li><a href=\"http:\/\/www.thefutureoftheweb.com\/blog\/detect-browser-window-focus\" target=\"_blank\">Detecting focus of a browser window<\/a><\/li>\n<\/ul>\n<pre class=\"lang:js decode:true\">$(function(){\r\n\r\n    \/\/ \u9801\u9762\u4f5c\u7528\u624d\u66f4\u65b0\u8cc7\u6599\r\n    window.onfocus = function(){\r\n        setInterval(function(){\r\n            search();\r\n        }, 10000);\r\n    };\r\n    window.onblur = function(){\r\n        for (var i = 1; i &lt; 9; i++) window.clearInterval(i);\r\n    };\r\n});<\/pre>\n<p>&nbsp;<\/p>\n<p>--<\/p>\n<h2>\u5143\u7d20\u51fa\u73fe\u5c31\u4f5c\u7528<\/h2>\n<ul>\n<li><a href=\"https:\/\/stackoverflow.com\/questions\/123999\/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport\">How to tell if a DOM element is visible in the current viewport?<\/a><\/li>\n<li>http:\/\/jsfiddle.net\/AndyE\/d48Cv\/1\/<\/li>\n<li><a href=\"https:\/\/github.com\/mmmeff\/jquery.inview2\">jquery.inview2<\/a><\/li>\n<\/ul>\n<pre class=\"lang:js decode:true\">$('div').bind('inview', function(event, isInView) {\r\n    if (isInView) {\r\n        $(this).css('background-color', '#f00');\r\n    } else {\r\n        $(this).css('background-color', '#00f');\r\n    }\r\n});<\/pre>\n<p>--<\/p>\n<h2>\u5143\u7d20\u5b8c\u6574\u51fa\u73fe\u624d\u4f5c\u7528<\/h2>\n<ul>\n<li><a href=\"https:\/\/stackoverflow.com\/questions\/21163756\/html5-and-javascript-to-play-videos-only-when-visible\">HTML5 and Javascript to play videos only when visible<\/a><\/li>\n<li><a href=\"https:\/\/github.com\/zeusdeux\/isInViewport\">isInViewport<\/a><\/li>\n<\/ul>\n<pre class=\"lang:js decode:true \">&lt;div style=\"width: 300px; height: 300px;\"&gt;\r\n    &lt;p&gt;C&lt;\/p&gt;\r\n&lt;\/div&gt;\r\n&lt;hr\/&gt;\r\n\r\n&lt;script&gt;\r\n    $(window).scroll(function() {\r\n        $('div:in-viewport(-320)').css({\r\n            'background-color': '#f00',\r\n            'color': '#151612'\r\n        }).find('p').text('Now in viewport.');\r\n    });\r\n&lt;\/script&gt;<\/pre>\n<p>--<\/p>\n<div class=\"pvc_clear\"><\/div>\n<p class=\"pvc_stats all \" data-element-id=\"3766\" style=\"\"><i class=\"pvc-stats-icon medium\" aria-hidden=\"true\"><svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"far\" data-icon=\"chart-bar\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 512 512\" class=\"svg-inline--fa fa-chart-bar fa-w-16 fa-2x\"><path fill=\"currentColor\" d=\"M396.8 352h22.4c6.4 0 12.8-6.4 12.8-12.8V108.8c0-6.4-6.4-12.8-12.8-12.8h-22.4c-6.4 0-12.8 6.4-12.8 12.8v230.4c0 6.4 6.4 12.8 12.8 12.8zm-192 0h22.4c6.4 0 12.8-6.4 12.8-12.8V140.8c0-6.4-6.4-12.8-12.8-12.8h-22.4c-6.4 0-12.8 6.4-12.8 12.8v198.4c0 6.4 6.4 12.8 12.8 12.8zm96 0h22.4c6.4 0 12.8-6.4 12.8-12.8V204.8c0-6.4-6.4-12.8-12.8-12.8h-22.4c-6.4 0-12.8 6.4-12.8 12.8v134.4c0 6.4 6.4 12.8 12.8 12.8zM496 400H48V80c0-8.84-7.16-16-16-16H16C7.16 64 0 71.16 0 80v336c0 17.67 14.33 32 32 32h464c8.84 0 16-7.16 16-16v-16c0-8.84-7.16-16-16-16zm-387.2-48h22.4c6.4 0 12.8-6.4 12.8-12.8v-70.4c0-6.4-6.4-12.8-12.8-12.8h-22.4c-6.4 0-12.8 6.4-12.8 12.8v70.4c0 6.4 6.4 12.8 12.8 12.8z\" class=\"\"><\/path><\/svg><\/i> &nbsp;1,266&nbsp;total views<\/p>\n<div class=\"pvc_clear\"><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Detect If Brows...<\/p>\n<div class=\"pvc_clear\"><\/div>\n<p class=\"pvc_stats all \" data-element-id=\"3766\" style=\"\"><i class=\"pvc-stats-icon medium\" aria-hidden=\"true\"><svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"far\" data-icon=\"chart-bar\" role=\"img\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 512 512\" class=\"svg-inline--fa fa-chart-bar fa-w-16 fa-2x\"><path fill=\"currentColor\" d=\"M396.8 352h22.4c6.4 0 12.8-6.4 12.8-12.8V108.8c0-6.4-6.4-12.8-12.8-12.8h-22.4c-6.4 0-12.8 6.4-12.8 12.8v230.4c0 6.4 6.4 12.8 12.8 12.8zm-192 0h22.4c6.4 0 12.8-6.4 12.8-12.8V140.8c0-6.4-6.4-12.8-12.8-12.8h-22.4c-6.4 0-12.8 6.4-12.8 12.8v198.4c0 6.4 6.4 12.8 12.8 12.8zm96 0h22.4c6.4 0 12.8-6.4 12.8-12.8V204.8c0-6.4-6.4-12.8-12.8-12.8h-22.4c-6.4 0-12.8 6.4-12.8 12.8v134.4c0 6.4 6.4 12.8 12.8 12.8zM496 400H48V80c0-8.84-7.16-16-16-16H16C7.16 64 0 71.16 0 80v336c0 17.67 14.33 32 32 32h464c8.84 0 16-7.16 16-16v-16c0-8.84-7.16-16-16-16zm-387.2-48h22.4c6.4 0 12.8-6.4 12.8-12.8v-70.4c0-6.4-6.4-12.8-12.8-12.8h-22.4c-6.4 0-12.8 6.4-12.8 12.8v70.4c0 6.4 6.4 12.8 12.8 12.8z\" class=\"\"><\/path><\/svg><\/i> &nbsp;1,266&nbsp;total views<\/p>\n<div class=\"pvc_clear\"><\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[262],"tags":[],"_links":{"self":[{"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=\/wp\/v2\/posts\/3766"}],"collection":[{"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3766"}],"version-history":[{"count":4,"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=\/wp\/v2\/posts\/3766\/revisions"}],"predecessor-version":[{"id":3798,"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=\/wp\/v2\/posts\/3766\/revisions\/3798"}],"wp:attachment":[{"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3766"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3766"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.hoyo.idv.tw\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3766"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}