{"id":2986,"date":"2019-11-09T02:40:34","date_gmt":"2019-11-08T18:40:34","guid":{"rendered":"https:\/\/blog.naibabiji.com\/?p=2986"},"modified":"2019-11-09T02:40:34","modified_gmt":"2019-11-08T18:40:34","slug":"wordpress-xia-xue-te-xiao","status":"publish","type":"post","link":"https:\/\/blog.naibabiji.com\/files\/wordpress-xia-xue-te-xiao.html","title":{"rendered":"\u5723\u8bde\u8282\u5143\u65e6WordPress\u4e0b\u96ea\u7279\u6548\u63d2\u4ef6\u548cjs\u4ee3\u7801\u5206\u4eab"},"content":{"rendered":"<p>\u5bf9\u4e8e\u4e2a\u4eba\u535a\u4e3b\u6765\u8bf4\uff0c\u78b0\u5230\u9022\u5e74\u8fc7\u8282\u7684\uff0c\u60f3\u7740\u7ed9\u7f51\u7ad9\u5f04\u70b9\u7279\u6548\u7684\u8fd8\u662f\u6709\u4e0d\u5c11\u6570\uff0c\u5929\u6c14\u51b7\u4e86\u770b\u7740\u5c31\u8981\u5230\u5723\u8bde\u8282\u5143\u65e6\u548c\u6625\u8282\u4e86\uff0c\u6240\u4ee5\u63d0\u524d\u7ed9\u5927\u5bb6\u5206\u4eab\u51e0\u4e2a<strong>WordPress\u7f51\u7ad9\u4e0b\u96ea\u63d2\u4ef6\u548cjs\u4ee3\u7801<\/strong>\u3002<\/p>\n<h2>\u7f51\u7ad9\u4e0b\u96ea\u63d2\u4ef6<\/h2>\n<h3 class=\"plugin-title\">Snow My WP<\/h3>\n<p><a href=\"https:\/\/edgeone.naibabiji.com\/wp-content\/uploads\/2019\/11\/wordpress-xia-xue-te-xiao-1.png?_upt=752687f61573237358\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2987\" src=\"https:\/\/edgeone.naibabiji.com\/wp-content\/uploads\/2019\/11\/wordpress-xia-xue-te-xiao-1.png?_upt=752687f61573237358\" alt=\"wordpress\u4e0b\u96ea\u7279\u6548\" width=\"655\" height=\"371\" \/><\/a><\/p>\n<p>Snow My WP\u8fd9\u6b3e\u63d2\u4ef6\u4f7f\u7528\u8d77\u6765\u975e\u5e38\u7b80\u5355\uff0c\u4e0b\u8f7d\uff0c\u542f\u7528\u540e\u5c31\u4f1a\u5728\u7f51\u7ad9\u524d\u53f0\u663e\u793a\u968f\u673a\u7684\u96ea\u82b1\u56fe\u7247\uff0c\u6ca1\u6709\u8bbe\u7f6e\u9879\uff0c\u4e0d\u9700\u8981\u4e0b\u96ea\u7279\u6548\u7684\u65f6\u5019\u76f4\u63a5\u7981\u7528\u63d2\u4ef6\u5373\u53ef\u3002<\/p>\n<p><a class=\"theme-demo\" href=\"https:\/\/wordpress.org\/plugins\/snow-my-wp\/\" target=\"_blank\" rel=\"noopener noreferrer\">\u4e0b\u8f7d\u5730\u5740<\/a><\/p>\n<h3>WP Snow &#8211; Best Snow Effect Plugin<\/h3>\n<p><a href=\"https:\/\/edgeone.naibabiji.com\/wp-content\/uploads\/2019\/11\/wordpress-xia-xue-te-xiao-2.png?_upt=53ff1a181573237603\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2988\" src=\"https:\/\/edgeone.naibabiji.com\/wp-content\/uploads\/2019\/11\/wordpress-xia-xue-te-xiao-2.png?_upt=53ff1a181573237603\" alt=\"WP Snow - Best Snow Effect Plugin\u4e0b\u96ea\u63d2\u4ef6\" width=\"673\" height=\"350\" \/><\/a><\/p>\n<p>WP Snow &#8211; Best Snow Effect Plugin\u8fd9\u6b3e\u4e0b\u96ea\u63d2\u4ef6\u5e26\u6709\u8bbe\u7f6e\u6709\u53f0\uff0c\u53ef\u4ee5\u8bbe\u7f6e\u96ea\u82b1\u5927\u5c0f\u989c\u8272\uff0c\u8fd8\u53ef\u4ee5\u8bbe\u7f6e\u663e\u793a\u6587\u5b57\u843d\u4e0b\u7684\u7279\u6548\uff0c\u5982\u679c\u4f60\u6709\u559c\u6b22\u7684\u4eba\uff0c\u53ef\u4ee5\u8bd5\u8bd5\u5723\u8bde\u8282\u4e0b\u51e0\u53e5\u8868\u767d\u7684\u8bdd\u3002<\/p>\n<p>\u8fd9\u6b3e\u63d2\u4ef6\u662f\u514d\u8d39\u7684\uff0c<span style=\"color: #ff00ff;\">\u63a8\u8350<\/span>\u3002<\/p>\n<p>\u6b64\u63d2\u4ef6\u53ef\u8ba9\u60a8\u521b\u5efa\u7cbe\u7f8e\u7684\u52a8\u753b\u96ea\u82b1\u6216\u5176\u4ed6\u7c7b\u578b\u7684\u96ea\u82b1\u3002\u4f8b\u5982\uff0c\u60a8\u53ef\u4ee5\u5c06\u5404\u79cd\u56fe\u6807\u7528\u4f5c\u96ea\u82b1\uff0c\u81ea\u5b9a\u4e49\u6587\u5b57\u7b49\u3002<\/p>\n<h4>\u7279\u5f81<\/h4>\n<ul>\n<li>\u81ea\u5b9a\u4e49\u96ea\u82b1\u5e03\u5c40\u2013\u6dfb\u52a0\u60a8\u81ea\u5df1\u7684\u81ea\u5b9a\u4e49\u6587\u672c\uff0c\u8be5\u6587\u672c\u4f1a\u50cf\u96ea\u82b1\u4e00\u6837\u843d\u4e0b<\/li>\n<li>Flakes Fonts \u96c6\u6210\u2013 \u53ef\u4ee5\u81ea\u5b9a\u4e49\u5b57\u4f53\u5e76\u4e14\u53ef\u9009Fontawesome\u56fe\u6807\u6548\u679c<\/li>\n<li>\u4ec5\u5728\u67d0\u4e9b\u5e16\u5b50\u6216\u9875\u9762\u4e0a\u663e\u793a\u96ea\u82b1\uff08\u4e5f\u652f\u6301\u81ea\u5b9a\u4e49\u5e16\u5b50\u7c7b\u578b\uff09<\/li>\n<li>\u81ea\u5b9a\u4e49\u96ea\u82b1\u7684\u989c\u8272\u2013\u60a8\u8fd8\u53ef\u4ee5\u8bbe\u7f6e\u968f\u673a\u5206\u914d\u7684\u591a\u79cd\u989c\u8272<\/li>\n<li>\u81ea\u5b9a\u4e49\u96ea\u82b1\u5b57\u4f53\u2013\u8fd8\u53ef\u4ee5\u8bbe\u7f6e\u968f\u673a\u5206\u914d\u7684\u591a\u79cd\u5b57\u4f53<\/li>\n<li>\u6dfb\u52a0\u81ea\u5b9a\u4e49\u8584\u7247\u6837\u5f0f\u2013\u60a8\u8fd8\u53ef\u4ee5\u5c06\u81ea\u5b9a\u4e49CSS\u6837\u5f0f\u6dfb\u52a0\u5230\u6bcf\u4e2a\u8584\u7247\uff0c\u4ee5\u5b9e\u73b0\u65e0\u9650\u53ef\u80fd<\/li>\n<li>\u76f4\u63a5\u5728\u8bbe\u7f6e\u4e2d\u505c\u7528\u96ea\u82b1-\u8fd9\u4f7f\u60a8\u53ef\u4ee5\u6bd4\u4ee5\u5f80\u66f4\u5feb\u5730\u63a7\u5236\u96ea\u82b1<\/li>\n<li>\u81ea\u5b9a\u4e49\u4e00\u6b21\u53ef\u89c1\u7684\u96ea\u82b1\u6570\u91cf<\/li>\n<li>\u81ea\u5b9a\u4e49\u96ea\u82b1\u7684\u4e0b\u964d\u901f\u5ea6<\/li>\n<li>\u81ea\u5b9a\u4e49\u96ea\u82b1\u7684\u6700\u5927\u548c\u6700\u5c0f\u5c3a\u5bf8<\/li>\n<li>\u901a\u8fc7\u66f4\u6539\u96ea\u82b1\u52a8\u753b\u7684\u5237\u65b0\u901f\u5ea6\u6765\u4f18\u5316\u6027\u80fd<\/li>\n<li>\u81ea\u5b9a\u4e49z-index\u6216\u60a8\u7684\u96ea\u82b1<\/li>\n<li>\u9ad8\u7ea7\u5f00\u53d1\u4eba\u5458\u6302\u94a9<\/li>\n<\/ul>\n<p><a class=\"theme-demo\" href=\"https:\/\/wordpress.org\/plugins\/wp-snow\/\" target=\"_blank\" rel=\"noopener noreferrer\">\u4e0b\u8f7d\u5730\u5740<\/a><\/p>\n<h3>Weather Effect<\/h3>\n<p>Weather Effect \u2013 Christmas effect, snow effect\u662f\u4e00\u6b3e\u5929\u6c14\u7279\u6548\u63d2\u4ef6\uff0c\u9664\u4e86\u4e0b\u96ea\uff0c\u8fd8\u80fd\u4e0b\u5723\u8bde\u8001\u4eba\uff0c\u5723\u8bde\u889c\u3002<\/p>\n<p><a href=\"https:\/\/edgeone.naibabiji.com\/wp-content\/uploads\/2019\/11\/wordpress-xia-xue-te-xiao-3.png?_upt=8ace41441573238143\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2989\" src=\"https:\/\/edgeone.naibabiji.com\/wp-content\/uploads\/2019\/11\/wordpress-xia-xue-te-xiao-3.png?_upt=8ace41441573238143\" alt=\"WP\u5929\u6c14\u7279\u6548\" width=\"821\" height=\"536\" \/><\/a><\/p>\n<p>\u5177\u6709\u591a\u79cd\u6548\u679c\u7684\u5929\u6c14\u6548\u679c\u63d2\u4ef6\uff08\u51ac\u5929\uff0c\u65b0\u5e74\uff0c\u79cb\u5929\uff0c\u7a7a\u5fc3\uff0c\u590f\u5929\uff0c\u6625\u5929\uff0c\u96e8\uff0c\u611f\u6069\u8282\uff0c\u60c5\u4eba\uff09\u3002<\/p>\n<p>\u8fd9\u662f\u65b0\u7684\u201c\u5929\u6c14\u6548\u679cWordPress\u63d2\u4ef6\u201d\uff0c\u5b83\u57fa\u4e8eIrresistible CSS\u548cJS\uff0c\u56e0\u6b64\u5b83\u975e\u5e38\u795e\u5947\u4e14\u6613\u4e8e\u4f7f\u7528\u3002<\/p>\n<p>\u6700\u597d\u7684WordPress Weather Effect\u63d2\u4ef6\uff0c\u53ea\u9700\u5355\u51fb\u51e0\u4e0b\uff0c\u5373\u53ef\u5e2e\u52a9\u60a8\u4f7f\u7f51\u7ad9\u7f8e\u89c2\u3002<\/p>\n<p>\u6839\u636e\u5929\u6c14\u548c\u573a\u5408\uff0c\u5b83\u5177\u6709\u8bb8\u591a\u4e0b\u964d\u6548\u679c\uff0c\u60a8\u53ef\u4ee5\u6839\u636e\u81ea\u5df1\u7684\u60f3\u6cd5\u9009\u62e9\u6548\u679c\uff0c\u7528\u6237\u53ef\u4ee5\u5728\u81ea\u5df1\u7684\u7f51\u7ad9\u4e0a\u6dfb\u52a010\u591a\u79cd\u4e0b\u964d\u6548\u679c\u3002<\/p>\n<p>Weather Effect WordPress\u63d2\u4ef6\u662f\u552f\u4e00\u4e00\u4e2a\u5bf9\u4efb\u4f55\u7f51\u7ad9\u90fd\u5177\u6709\u7279\u6b8a\u4e0b\u964d\u6548\u679c\u7684\u63d2\u4ef6\uff0c\u60a8\u53ef\u4ee5\u4f7f\u7528Weather Effect WordPress\u63d2\u4ef6\u6839\u636e\u4efb\u4f55\u5929\u6c14\u6216\u573a\u5408\u88c5\u9970\u7f51\u7ad9\u3002<\/p>\n<p>\u8fd9\u4e2a\u5929\u6c14\u6548\u679c\u63d2\u4ef6\u975e\u5e38\u9002\u5408\u65b0\u8001\u7528\u6237\u4f7f\u7528\uff0c\u56e0\u4e3a\u5b83\u5177\u6709\u4e00\u4e9b\u7b80\u5355\u7684\u914d\u7f6e\u5e76\u4e14\u6ca1\u6709\u4efb\u4f55\u77ed\u4ee3\u7801\uff0c\u56e0\u6b64\u60a8\u53ef\u4ee5\u592a\u7b80\u5355\u5730\u4f7f\u7528\u5b83\uff0c\u53ea\u9700\u914d\u7f6e\u63d2\u4ef6\u7684\u8bbe\u7f6e\u5e76\u4f7f\u7528\u4fdd\u5b58\u6309\u94ae\u4fdd\u5b58\u8bbe\u7f6e\u5373\u53ef\u3002<\/p>\n<p>\u8fd9\u6b3eWeather Effect\u662f\u4ed8\u8d39\u63d2\u4ef6\uff0c\u4e0d\u8fc7\u514d\u8d39\u7684\u529f\u80fd\u5df2\u7ecf\u591f\u7528\u4e86\uff0c\u4e5f\u53ef\u4ee5\u8003\u8651\u3002<\/p>\n<p><a class=\"theme-demo\" href=\"https:\/\/wordpress.org\/plugins\/weather-effect\/\" target=\"_blank\" rel=\"noopener noreferrer\">\u4e0b\u8f7d\u5730\u5740<\/a><\/p>\n<h2>\u4e0b\u96ea\u7279\u6548JS\u4ee3\u7801<\/h2>\n<p>JS\u4ee3\u7801\u9700\u8981\u4fee\u6539\u7f51\u7ad9\u4e3b\u9898\u6e90\u7801\u6587\u4ef6\uff0c\u5982\u679c\u4f60\u4e0d\u4e0d\u719f\u6089\uff0c\u5efa\u8bae\u4f7f\u7528\u4e0a\u9762\u63a8\u8350\u7684\u63d2\u4ef6\u5b9e\u73b0<strong>\u4e0b\u96ea\u7279\u6548<\/strong>\u3002<\/p>\n<p>\u7279\u6548\u6548\u679c\u5982\u4e0b\u56fe\uff0c\u96ea\u82b1\u662f\u4ee3\u7801\u4e00\u7684\u6548\u679c\uff0c\u767d\u8272\u7684\u70b9\u662f\u4ee3\u7801\u4e8c\u7684\u6548\u679c\u3002js\u4ee3\u7801\u6765\u81ea<a href=\"https:\/\/zhang.ge\/4865.html\">\u5f20\u6208\u535a\u5ba2<\/a>\u3002<\/p>\n<p><a href=\"https:\/\/edgeone.naibabiji.com\/wp-content\/uploads\/2019\/11\/wordpress-xia-xue-te-xiao-4.png?_upt=03bc034a1573238378\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2990\" src=\"https:\/\/edgeone.naibabiji.com\/wp-content\/uploads\/2019\/11\/wordpress-xia-xue-te-xiao-4.png?_upt=03bc034a1573238378\" alt=\"\u4e0b\u96ea\u7279\u6548JS\u4ee3\u7801\" width=\"672\" height=\"366\" \/><\/a><\/p>\n<h3>\u4e0b\u9700js\u4ee3\u7801\u4e00<\/h3>\n<pre>&lt;script type=\"text\/javascript\"&gt;\r\n(function($){\r\n\t$.fn.snow = function(options){\r\n\tvar $flake = $('&lt;div id=\"snowbox\" \/&gt;').css({'position': 'absolute','z-index':'9999', 'top': '-50px'}).html('&amp;#10052;'),\r\n\tdocumentHeight \t= $(document).height(),\r\n\tdocumentWidth\t= $(document).width(),\r\n\tdefaults = {\r\n\t\tminSize\t\t: 10,\r\n\t\tmaxSize\t\t: 20,\r\n\t\tnewOn\t\t: 1000,\r\n\t\tflakeColor\t: \"#AFDAEF\" \/* \u6b64\u5904\u53ef\u4ee5\u5b9a\u4e49\u96ea\u82b1\u989c\u8272\uff0c\u82e5\u8981\u767d\u8272\u53ef\u4ee5\u6539\u4e3a#FFFFFF *\/\r\n\t},\r\n\toptions\t= $.extend({}, defaults, options);\r\n\tvar interval= setInterval( function(){\r\n\tvar startPositionLeft = Math.random() * documentWidth - 100,\r\n\tstartOpacity = 0.5 + Math.random(),\r\n\tsizeFlake = options.minSize + Math.random() * options.maxSize,\r\n\tendPositionTop = documentHeight - 200,\r\n\tendPositionLeft = startPositionLeft - 500 + Math.random() * 500,\r\n\tdurationFall = documentHeight * 10 + Math.random() * 5000;\r\n\t$flake.clone().appendTo('body').css({\r\n\t\tleft: startPositionLeft,\r\n\t\topacity: startOpacity,\r\n\t\t'font-size': sizeFlake,\r\n\t\tcolor: options.flakeColor\r\n\t}).animate({\r\n\t\ttop: endPositionTop,\r\n\t\tleft: endPositionLeft,\r\n\t\topacity: 0.2\r\n\t},durationFall,'linear',function(){\r\n\t\t$(this).remove()\r\n\t});\r\n\t}, options.newOn);\r\n    };\r\n})(jQuery);\r\n$(function(){\r\n    $.fn.snow({ \r\n\t    minSize: 5, \/* \u5b9a\u4e49\u96ea\u82b1\u6700\u5c0f\u5c3a\u5bf8 *\/\r\n\t    maxSize: 50,\/* \u5b9a\u4e49\u96ea\u82b1\u6700\u5927\u5c3a\u5bf8 *\/\r\n\t    newOn: 300  \/* \u5b9a\u4e49\u5bc6\u96c6\u7a0b\u5ea6\uff0c\u6570\u5b57\u8d8a\u5c0f\u8d8a\u5bc6\u96c6 *\/\r\n    });\r\n});\r\n&lt;\/script&gt;<\/pre>\n<h3>\u4e0b\u96eajs\u7279\u6548\u4e8c<\/h3>\n<pre>&lt;script type=\"text\/javascript\"&gt;\r\n    \/* \u63a7\u5236\u4e0b\u96ea *\/\r\n    function snowFall(snow) {\r\n        \/* \u53ef\u914d\u7f6e\u5c5e\u6027 *\/\r\n        snow = snow || {};\r\n        this.maxFlake = snow.maxFlake || 200;   \/* \u6700\u591a\u7247\u6570 *\/\r\n        this.flakeSize = snow.flakeSize || 10;  \/* \u96ea\u82b1\u5f62\u72b6 *\/\r\n        this.fallSpeed = snow.fallSpeed || 1;   \/* \u5760\u843d\u901f\u5ea6 *\/\r\n    }\r\n    \/* \u517c\u5bb9\u5199\u6cd5 *\/\r\n    requestAnimationFrame = window.requestAnimationFrame ||\r\n        window.mozRequestAnimationFrame ||\r\n        window.webkitRequestAnimationFrame ||\r\n        window.msRequestAnimationFrame ||\r\n        window.oRequestAnimationFrame ||\r\n        function(callback) { setTimeout(callback, 1000 \/ 60); };\r\n \r\n    cancelAnimationFrame = window.cancelAnimationFrame ||\r\n        window.mozCancelAnimationFrame ||\r\n        window.webkitCancelAnimationFrame ||\r\n        window.msCancelAnimationFrame ||\r\n        window.oCancelAnimationFrame;\r\n    \/* \u5f00\u59cb\u4e0b\u96ea *\/\r\n    snowFall.prototype.start = function(){\r\n        \/* \u521b\u5efa\u753b\u5e03 *\/\r\n        snowCanvas.apply(this);\r\n        \/* \u521b\u5efa\u96ea\u82b1\u5f62\u72b6 *\/\r\n        createFlakes.apply(this);\r\n        \/* \u753b\u96ea *\/\r\n        drawSnow.apply(this)\r\n    }\r\n    \/* \u521b\u5efa\u753b\u5e03 *\/\r\n    function snowCanvas() {\r\n        \/* \u6dfb\u52a0Dom\u7ed3\u70b9 *\/\r\n        var snowcanvas = document.createElement(\"canvas\");\r\n        snowcanvas.id = \"snowfall\";\r\n        snowcanvas.width = window.innerWidth;\r\n        snowcanvas.height = document.body.clientHeight;\r\n        snowcanvas.setAttribute(\"style\", \"position:absolute; top: 0; left: 0; z-index: 1; pointer-events: none;\");\r\n        document.getElementsByTagName(\"body\")[0].appendChild(snowcanvas);\r\n        this.canvas = snowcanvas;\r\n        this.ctx = snowcanvas.getContext(\"2d\");\r\n        \/* \u7a97\u53e3\u5927\u5c0f\u6539\u53d8\u7684\u5904\u7406 *\/\r\n        window.onresize = function() {\r\n            snowcanvas.width = window.innerWidth;\r\n            \/* snowcanvas.height = window.innerHeight *\/\r\n        }\r\n    }\r\n    \/* \u96ea\u8fd0\u52a8\u5bf9\u8c61 *\/\r\n    function flakeMove(canvasWidth, canvasHeight, flakeSize, fallSpeed) {\r\n        this.x = Math.floor(Math.random() * canvasWidth);   \/* x\u5750\u6807 *\/\r\n        this.y = Math.floor(Math.random() * canvasHeight);  \/* y\u5750\u6807 *\/\r\n        this.size = Math.random() * flakeSize + 2;          \/* \u5f62\u72b6 *\/\r\n        this.maxSize = flakeSize;                           \/* \u6700\u5927\u5f62\u72b6 *\/\r\n        this.speed = Math.random() * 1 + fallSpeed;         \/* \u5760\u843d\u901f\u5ea6 *\/\r\n        this.fallSpeed = fallSpeed;                         \/* \u5760\u843d\u901f\u5ea6 *\/\r\n        this.velY = this.speed;                             \/* Y\u65b9\u5411\u901f\u5ea6 *\/\r\n        this.velX = 0;                                      \/* X\u65b9\u5411\u901f\u5ea6 *\/\r\n        this.stepSize = Math.random() \/ 30;                 \/* \u6b65\u957f *\/\r\n        this.step = 0                                       \/* \u6b65\u6570 *\/\r\n    }\r\n    flakeMove.prototype.update = function() {\r\n        var x = this.x,\r\n            y = this.y;\r\n        \/* \u5de6\u53f3\u6446\u52a8(\u4f59\u5f26) *\/\r\n        this.velX *= 0.98;\r\n        if (this.velY &lt;= this.speed) {\r\n            this.velY = this.speed\r\n        }\r\n        this.velX += Math.cos(this.step += .05) * this.stepSize;\r\n \r\n        this.y += this.velY;\r\n        this.x += this.velX;\r\n        \/* \u98de\u51fa\u8fb9\u754c\u7684\u5904\u7406 *\/\r\n        if (this.x &gt;= canvas.width || this.x &lt;= 0 || this.y &gt;= canvas.height || this.y &lt;= 0) {\r\n            this.reset(canvas.width, canvas.height)\r\n        }\r\n    };\r\n    \/* \u98de\u51fa\u8fb9\u754c-\u653e\u7f6e\u6700\u9876\u7aef\u7ee7\u7eed\u5760\u843d *\/\r\n    flakeMove.prototype.reset = function(width, height) {\r\n        this.x = Math.floor(Math.random() * width);\r\n        this.y = 0;\r\n        this.size = Math.random() * this.maxSize + 2;\r\n        this.speed = Math.random() * 1 + this.fallSpeed;\r\n        this.velY = this.speed;\r\n        this.velX = 0;\r\n    };\r\n    \/\/ \u6e32\u67d3\u96ea\u82b1-\u968f\u673a\u5f62\u72b6\uff08\u6b64\u5904\u53ef\u4fee\u6539\u96ea\u82b1\u989c\u8272\uff01\uff01\uff01\uff09\r\n    flakeMove.prototype.render = function(ctx) {\r\n        var snowFlake = ctx.createRadialGradient(this.x, this.y, 0, this.x, this.y, this.size);\r\n        snowFlake.addColorStop(0, \"rgba(255, 255, 255, 0.9)\");  \/* \u6b64\u5904\u662f\u96ea\u82b1\u989c\u8272\uff0c\u9ed8\u8ba4\u662f\u767d\u8272 *\/\r\n        snowFlake.addColorStop(.5, \"rgba(255, 255, 255, 0.5)\"); \/* \u82e5\u8981\u6539\u4e3a\u5176\u4ed6\u989c\u8272\uff0c\u8bf7\u81ea\u884c\u67e5 *\/\r\n        snowFlake.addColorStop(1, \"rgba(255, 255, 255, 0)\");    \/* \u627e16\u8fdb\u5236\u7684RGB \u989c\u8272\u4ee3\u7801\u3002 *\/\r\n        ctx.save();\r\n        ctx.fillStyle = snowFlake;\r\n        ctx.beginPath();\r\n        ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);\r\n        ctx.fill();\r\n        ctx.restore();\r\n    };\r\n    \/* \u521b\u5efa\u96ea\u82b1-\u5b9a\u4e49\u5f62\u72b6 *\/\r\n    function createFlakes() {\r\n        var maxFlake = this.maxFlake,\r\n            flakes = this.flakes = [],\r\n            canvas = this.canvas;\r\n        for (var i = 0; i &lt; maxFlake; i++) {\r\n            flakes.push(new flakeMove(canvas.width, canvas.height, this.flakeSize, this.fallSpeed))\r\n        }\r\n    }\r\n    \/* \u753b\u96ea *\/\r\n    function drawSnow() {\r\n        var maxFlake = this.maxFlake,\r\n            flakes = this.flakes;\r\n        ctx = this.ctx, canvas = this.canvas, that = this;\r\n        \/* \u6e05\u7a7a\u96ea\u82b1 *\/\r\n        ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n        for (var e = 0; e &lt; maxFlake; e++) {\r\n            flakes[e].update();\r\n            flakes[e].render(ctx);\r\n        }\r\n        \/*  \u4e00\u5e27\u4e00\u5e27\u7684\u753b *\/\r\n        this.loop = requestAnimationFrame(function() {\r\n            drawSnow.apply(that);\r\n        });\r\n    }\r\n    \/* \u8c03\u7528\u53ca\u63a7\u5236\u65b9\u6cd5 *\/\r\n    var snow = new snowFall({maxFlake:500});\r\n    snow.start();\r\n&lt;\/script&gt;<\/pre>\n<h3>js\u4ee3\u7801\u4f7f\u7528\u65b9\u6cd5<\/h3>\n<p>\u65b9\u6cd5\u2460\u3001\u590d\u5236\u5176\u4e2d\u4e00\u79cdJS\u4ee3\u7801\uff0c\u7c98\u8d34\u5230\u7f51\u7ad9&lt;\/body&gt;\u6807\u7b7e\u4e4b\u524d\u5373\u53ef\uff1b<\/p>\n<p>\u65b9\u6cd5\u2461\u3001\u53bb\u6389\u4ee3\u7801\u524d\u540e\u7684&lt;script **&gt;\u6807\u7b7e\uff0c\u7136\u540e\u5c06\u4ee3\u7801\u4fdd\u5b58\u4e3ajs\u6587\u4ef6\uff0c\u6700\u540e\u5728\u7f51\u7ad9\u5f15\u7528\u5373\u53ef\u3002<\/p>\n<p>Ps\uff1a\u82e5\u6ca1\u6548\u679c\uff0c\u8bf7\u786e\u8ba4\u7f51\u9875\u662f\u5426\u5df2\u8f7d\u5165JQurey\uff0c\u5982\u679c\u6ca1\u6709\u8bf7\u5728\u4e0b\u96ea\u4ee3\u7801\u4e4b\u524d\u5f15\u5165JQ\u5373\u53ef\u3002<\/p>\n<p>\u4e0a\u9762\u5c31\u662f<a href=\"https:\/\/blog.naibabiji.com\/other\/wordpress-xia-xue-te-xiao.html\">\u5723\u8bde\u8282\u5143\u65e6WordPress\u4e0b\u96ea\u7279\u6548\u63d2\u4ef6\u548cjs\u4ee3\u7801\u5206\u4eab<\/a>\u7684\u5168\u90e8\u5185\u5bb9\uff0c\u5982\u679c\u4f60\u6709\u66f4\u597d\u770b\u7684\u7f51\u9875\u7279\u6548\uff0c\u4e0d\u59a8\u5206\u4eab\u7ed9\u6211\u4eec\u3002<\/p>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-center kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;center&quot;,&quot;id&quot;:&quot;2986&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;1&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;3&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;4&quot;,&quot;greet&quot;:&quot;\u7ed9\u672c\u6587\u6253\u5206 post&quot;,&quot;legend&quot;:&quot;3\\\/5 - (1 vote)&quot;,&quot;size&quot;:&quot;24&quot;,&quot;title&quot;:&quot;\u5723\u8bde\u8282\u5143\u65e6WordPress\u4e0b\u96ea\u7279\u6548\u63d2\u4ef6\u548cjs\u4ee3\u7801\u5206\u4eab&quot;,&quot;width&quot;:&quot;82&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} - ({count} {votes})&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 82px;\">\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 19.2px;\">\n            3\/5 - (1 vote)    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u5bf9\u4e8e\u4e2a\u4eba\u535a\u4e3b\u6765\u8bf4\uff0c\u78b0\u5230\u9022\u5e74\u8fc7\u8282\u7684\uff0c\u60f3\u7740\u7ed9\u7f51\u7ad9\u5f04\u70b9\u7279\u6548\u7684\u8fd8\u662f\u6709\u4e0d\u5c11\u6570\uff0c\u5929\u6c14\u51b7\u4e86\u770b\u7740\u5c31\u8981\u5230\u5723\u8bde\u8282\u5143\u65e6\u548c\u6625\u8282\u4e86\uff0c\u6240\u4ee5 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":2991,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"slim_seo":{"title":"\u5723\u8bde\u8282\u5143\u65e6WordPress\u4e0b\u96ea\u7279\u6548\u63d2\u4ef6\u548cjs\u4ee3\u7801\u5206\u4eab - \u5976\u7238\u5efa\u7ad9\u7b14\u8bb0","description":"\u5bf9\u4e8e\u4e2a\u4eba\u535a\u4e3b\u6765\u8bf4\uff0c\u78b0\u5230\u9022\u5e74\u8fc7\u8282\u7684\uff0c\u60f3\u7740\u7ed9\u7f51\u7ad9\u5f04\u70b9\u7279\u6548\u7684\u8fd8\u662f\u6709\u4e0d\u5c11\u6570\uff0c\u5929\u6c14\u51b7\u4e86\u770b\u7740\u5c31\u8981\u5230\u5723\u8bde\u8282\u5143\u65e6\u548c\u6625\u8282\u4e86\uff0c\u6240\u4ee5\u63d0\u524d\u7ed9\u5927\u5bb6\u5206\u4eab\u51e0\u4e2a WordPress\u7f51\u7ad9\u4e0b\u96ea\u63d2\u4ef6\u548cjs\u4ee3\u7801 \u3002 \u7f51\u7ad9\u4e0b\u96ea\u63d2\u4ef6 Snow My WP Snow My WP\u8fd9\u6b3e\u63d2\u4ef6\u4f7f\u7528\u8d77\u6765\u975e\u5e38\u7b80\u5355\uff0c\u4e0b\u8f7d\uff0c\u542f\u7528\u540e\u5c31\u4f1a\u5728\u7f51\u7ad9\u524d\u53f0\u663e\u793a\u968f\u673a\u7684\u96ea\u82b1\u56fe\u7247\uff0c\u6ca1\u6709\u8bbe\u7f6e\u9879\uff0c\u4e0d\u9700"},"footnotes":""},"categories":[381,140],"tags":[],"class_list":["post-2986","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-plugins","category-files"],"_links":{"self":[{"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/posts\/2986","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/comments?post=2986"}],"version-history":[{"count":0,"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/posts\/2986\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/media\/2991"}],"wp:attachment":[{"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/media?parent=2986"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/categories?post=2986"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.naibabiji.com\/wp-json\/wp\/v2\/tags?post=2986"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}