{"id":29366,"date":"2024-11-25T09:26:35","date_gmt":"2024-11-25T01:26:35","guid":{"rendered":"https:\/\/fwq.ai\/blog\/29366\/"},"modified":"2024-11-25T09:26:35","modified_gmt":"2024-11-25T01:26:35","slug":"%e5%88%b6%e4%bd%9c%e5%9b%9e%e5%88%b0%e9%a1%b6%e9%83%a8%e6%8c%89%e9%92%ae","status":"publish","type":"post","link":"https:\/\/fwq.ai\/blog\/29366\/","title":{"rendered":"\u5236\u4f5c\u56de\u5230\u9876\u90e8\u6309\u94ae"},"content":{"rendered":"<p>top<\/a>:0px;<a><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\">\u6211\u4eec\u5148\u770b\u4e00\u4e0b\u6548\u679c\u5427\uff0c\u76f4\u63a5\u4e0a\u56fe\u3002<\/span><\/p>\n<p style=\"padding:0px;margin-top:0px;line-height:2em;margin-bottom:0px\"><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\">\u7b2c\u4e00\u79cd\u60c5\u51b5,\u5f53\u9875\u9762\u5728\u9876\u90e8\u7684\u65f6\u5019\uff0c\u56de\u5230\u9876\u90e8\u6309\u94ae\u662f\u4e0d\u4f1a\u51fa\u73b0\u7684\u3002<\/span><\/p>\n<p style=\"padding:0px;margin-top:0px;line-height:2em;margin-bottom:0px\"><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\"><br \/><\/span><\/p>\n<p style=\"padding: 0px;margin-top: 0px;line-height: 2em;text-align: left;margin-bottom: 0px\"><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\"><img decoding=\"async\" src=\"https:\/\/img.php.cn\/upload\/article\/000\/000\/010\/58001ae84f14e4515dac595ddccaee3a-0.jpg\" class=\"aligncenter\" title=\"\u5236\u4f5c\u56de\u5230\u9876\u90e8\u6309\u94ae\u63d2\u56fe\" alt=\"\u5236\u4f5c\u56de\u5230\u9876\u90e8\u6309\u94ae\u63d2\u56fe\" \/><br \/><\/span><\/p>\n<p style=\"padding:0px;margin-top:0px;line-height:2em;margin-bottom:0px\"><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\">\u7b2c\u4e8c\u79cd\u60c5\u51b5,\u5f53\u9875\u9762\u5728\u79bb\u5f00\u9876\u90e8\u4e00\u5b9a\u8ddd\u79bb\u7684\u65f6\u5019\uff0c\u56de\u5230\u9876\u90e8\u6309\u94ae\u51fa\u73b0<\/span><\/p>\n<p style=\"padding: 0px;margin-top: 0px;line-height: 2em;text-align: left;margin-bottom: 0px\"><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\"><img decoding=\"async\" src=\"https:\/\/img.php.cn\/upload\/article\/000\/000\/010\/58001ae84f14e4515dac595ddccaee3a-1.jpg\" class=\"aligncenter\" title=\"\u5236\u4f5c\u56de\u5230\u9876\u90e8\u6309\u94ae\u63d2\u56fe1\" alt=\"\u5236\u4f5c\u56de\u5230\u9876\u90e8\u6309\u94ae\u63d2\u56fe1\" \/><br \/><\/span><\/p>\n<p style=\"padding:0px;margin-top:0px;line-height:2em;margin-bottom:0px\"><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\">\u63a5\u4e0b\u5c31\u662f\u5bf9\u4ee3\u7801\u7684\u5206\u6790\u4e86\uff1a <br \/>\u5728\u8fd9\u91cc\u6211\u4eec\u5982\u679c\u8981\u4f7f\u7528\u6eda\u52a8\u4e8b\u4ef6\u7684\u8bdd\uff0c\u5c0f\u7a0b\u5e8f\u89c4\u5b9a \u6700\u5916\u5c42\u4e00\u5b9a\u8981\u4f7f\u7528scroll-view\u6807\u7b7e\u8fdb\u884c\u5305\u88f9\uff0c\u7136\u540e\u5728\u8bbe\u7f6escroll-y=\u201dtrue\u201d \u610f\u601d\u662f\u5141\u8bb8\u9875\u9762\u4e86\u7eb5\u5411\u6eda\u52a8\uff0cscroll-top\u662f\u6eda\u52a8\u5230\u9876\u90e8\u505a\u5904\u7406\uff0c\u4e00\u822c\u7ed1\u5b9a\u4e00\u4e2a\u4e8b\u4ef6\uff0cbindscrolltolower\u540c\u6837\u7684\u539f\u7406\uff0c\u6eda\u52a8\u5230\u5e95\u90e8\u505a\u5904\u7406\uff0cbindscroll\u8868\u793a\u5728\u6eda\u52a8\u7684\u65f6\u5019\u51fa\u53d1\u8fd9\u4e2a\u4e8b\u4ef6\u3002\u4e0b\u9762WXML\u5185\u90e8\u7684\u8bdd\uff0c\u5c31\u662f\u6211\u4eec\u56de\u5230\u9876\u90e8\u7684\u6309\u94ae\u8bbe\u7f6e\uff0c\u6211\u4eec\u5728\u70b9\u51fb\u5b83\u65f6\u7ed1\u5b9a\u4e00\u4e2a\u4e8b\u4ef6goTop\uff0c\u8ba9\u4ed6\u7684\u6eda\u52a8\u9ad8\u5ea6\u7b49\u4e8e0\uff0c\u8fd9\u6837\u5b83\u5c31\u56de\u5230\u9876\u90e8\u4e86\u3002<\/span><\/p>\n<p style=\"padding:0px;margin-top:0px;line-height:2em;margin-bottom:0px\"><strong><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\">WXML\u4ee3\u7801\uff1a<\/span><\/strong><\/p>\n<pre>&lt;scroll-view bindscroll=\"scroll\"&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/*********************\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;view&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;view&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\u9876\u90e8\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;\/view&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;\/view&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/*********************\r\n&nbsp;&nbsp;&lt;\/scroll-view&gt;<\/pre>\n<p>  \u767b\u5f55\u540e\u590d\u5236   <\/p>\n<p style=\"padding:0px;margin-top:0px;line-height:2em;margin-bottom:0px\"><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\"><\/span><\/p>\n<p style=\"padding:0px;margin-top:0px;line-height:2em;margin-bottom:0px\"><strong><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\">JS\u4ee3\u7801\uff1a<\/span><\/strong><\/p>\n<pre>\/\/\u56de\u5230\u9876\u90e8\u6309\u94ae\r\nPage({\r\ndata:&nbsp;{\r\n&nbsp;&nbsp;&nbsp;&nbsp;scrollTop:&nbsp;0\r\n&nbsp;&nbsp;&nbsp;&nbsp;},\r\ngoTop:&nbsp;function(e){\r\n&nbsp;&nbsp;&nbsp;&nbsp;this.setData({\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;scrollTop:0\r\n&nbsp;&nbsp;&nbsp;&nbsp;})\r\n},\r\nscroll:function(e,res){\r\n\/\/&nbsp;\u5bb9\u5668\u6eda\u52a8\u65f6\u5c06\u6b64\u65f6\u7684\u6eda\u52a8\u8ddd\u79bb\u8d4b\u503c\u7ed9&nbsp;this.data.scrollTop\r\nif(e.detail.scrollTop&nbsp;&amp;gt;&nbsp;500){\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.setData({\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;floorstatus:&nbsp;true\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});\r\n}else&nbsp;{\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.setData({\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;floorstatus:&nbsp;false\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});\r\n&nbsp;&nbsp;&nbsp;&nbsp;}\r\n&nbsp;&nbsp;&nbsp;&nbsp;})<\/pre>\n<p>  \u767b\u5f55\u540e\u590d\u5236   <\/p>\n<p style=\"padding:0px;margin-top:0px;line-height:2em;margin-bottom:0px\"><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\"><\/span><\/p>\n<p style=\"padding:0px;margin-top:0px;line-height:2em;margin-bottom:0px\"><strong><span style=\"font-family:\u5fae\u8f6f\u96c5\u9ed1,\">WXSS\u4ee3\u7801\uff1a<\/span><\/strong><\/p>\n<pre>bigWrap{\r\nbackground:#eee;\r\n}\r\n\/goTop\u56de\u5230\u9876\u90e8\u56fe\u6807start\/\r\n.com-widget-goTop&nbsp;{\r\nposition:&nbsp;fixed;\r\nbottom:&nbsp;125px;\r\nright:&nbsp;5px;\r\nbackground:&nbsp;rgba(0,0,0,0.48);\r\nborder-radius:&nbsp;50%;\r\noverflow:&nbsp;hidden;\r\nz-index:&nbsp;500;\r\n}\r\n.com-widget-goTop&nbsp;.icon-gotop{\r\nbackground-color:&nbsp;rgba(0,0,0,0.8);\r\ndisplay:&nbsp;inline-block;\r\nwidth:&nbsp;50px;\r\nheight:&nbsp;50px;\r\nline-height:&nbsp;68px;\r\nfont-size:&nbsp;12px;\r\ncolor:&nbsp;#ffffff;\r\ntext-align:&nbsp;center;\r\nborder-radius:&nbsp;50%;\r\nbackground:&nbsp;url(http:\/\/m.dev.vd.cn\/static\/xcx\/v1\/goo\/w_2-3451cc437e.png)&nbsp;no-repeat&nbsp;center&nbsp;-1110px;\r\n-webkit-background-size:&nbsp;50px&nbsp;auto;\r\n}<\/pre>\n<p>  \u767b\u5f55\u540e\u590d\u5236           <\/p>\n<p>\u4ee5\u4e0a\u5c31\u662f\u5236\u4f5c\u56de\u5230\u9876\u90e8\u6309\u94ae\u7684\u8be6\u7ec6\u5185\u5bb9\uff0c\u66f4\u591a\u8bf7\u5173\u6ce8\u7c73\u4e91\u5176\u5b83\u76f8\u5173\u6587\u7ae0\uff01<\/p>\n","protected":false},"excerpt":{"rendered":"<p>top:0px;\u6211\u4eec\u5148\u770b\u4e00\u4e0b\u6548\u679c\u5427\uff0c\u76f4\u63a5\u4e0a\u56fe\u3002 \u7b2c\u4e00\u79cd\u60c5\u51b5,\u5f53\u9875\u9762\u5728\u9876\u90e8\u7684\u65f6\u5019\uff0c\u56de\u5230\u9876\u90e8\u6309\u94ae\u662f\u4e0d\u4f1a\u51fa\u73b0\u7684\u3002 \u7b2c\u4e8c\u79cd\u60c5\u51b5,\u5f53\u9875\u9762\u5728\u79bb\u5f00\u9876\u90e8\u4e00\u5b9a\u8ddd\u79bb\u7684\u65f6\u5019\uff0c\u56de\u5230\u9876\u90e8\u6309\u94ae\u51fa\u73b0 \u63a5\u4e0b\u5c31\u662f\u5bf9\u4ee3\u7801\u7684\u5206\u6790\u4e86\uff1a \u5728\u8fd9\u91cc\u6211\u4eec\u5982\u679c\u8981\u4f7f\u7528\u6eda\u52a8\u4e8b\u4ef6\u7684\u8bdd\uff0c\u5c0f\u7a0b\u5e8f\u89c4\u5b9a \u6700\u5916\u5c42\u4e00\u5b9a\u8981\u4f7f\u7528scroll-view\u6807\u7b7e\u8fdb\u884c\u5305\u88f9\uff0c\u7136\u540e\u5728\u8bbe\u7f6escroll-y=\u201dtrue\u201d \u610f\u601d\u662f\u5141\u8bb8\u9875\u9762\u4e86\u7eb5\u5411\u6eda\u52a8\uff0cscroll-top\u662f\u6eda\u52a8\u5230\u9876\u90e8\u505a\u5904\u7406\uff0c\u4e00\u822c\u7ed1\u5b9a\u4e00\u4e2a\u4e8b\u4ef6\uff0cbindscrolltolower\u540c\u6837\u7684\u539f\u7406\uff0c\u6eda\u52a8\u5230\u5e95\u90e8\u505a\u5904\u7406\uff0cbindscroll\u8868\u793a\u5728\u6eda\u52a8\u7684\u65f6\u5019\u51fa\u53d1\u8fd9\u4e2a\u4e8b\u4ef6\u3002\u4e0b\u9762WXML\u5185\u90e8\u7684\u8bdd\uff0c\u5c31\u662f\u6211\u4eec\u56de\u5230\u9876\u90e8\u7684\u6309\u94ae\u8bbe\u7f6e\uff0c\u6211\u4eec\u5728\u70b9\u51fb\u5b83\u65f6\u7ed1\u5b9a\u4e00\u4e2a\u4e8b\u4ef6goTop\uff0c\u8ba9\u4ed6\u7684\u6eda\u52a8\u9ad8\u5ea6\u7b49\u4e8e0\uff0c\u8fd9\u6837\u5b83\u5c31\u56de\u5230\u9876\u90e8\u4e86\u3002 WXML\u4ee3\u7801\uff1a &lt;scroll-view bindscroll=&#8221;scroll&#8221;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/********************* &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;view&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;view&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\u9876\u90e8 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;\/view&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;\/view&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/********************* &nbsp;&nbsp;&lt;\/scroll-view&gt; \u767b\u5f55\u540e\u590d\u5236 JS\u4ee3\u7801\uff1a \/\/\u56de\u5230\u9876\u90e8\u6309\u94ae Page({ data:&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;scrollTop:&nbsp;0 &nbsp;&nbsp;&nbsp;&nbsp;}, goTop:&nbsp;function(e){ &nbsp;&nbsp;&nbsp;&nbsp;this.setData({ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;scrollTop:0 &nbsp;&nbsp;&nbsp;&nbsp;}) }, scroll:function(e,res){ \/\/&nbsp;\u5bb9\u5668\u6eda\u52a8\u65f6\u5c06\u6b64\u65f6\u7684\u6eda\u52a8\u8ddd\u79bb\u8d4b\u503c\u7ed9&nbsp;this.data.scrollTop if(e.detail.scrollTop&nbsp;&amp;gt;&nbsp;500){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.setData({ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;floorstatus:&nbsp;true &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}); }else&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.setData({ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;floorstatus:&nbsp;false &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}); &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;}) \u767b\u5f55\u540e\u590d\u5236 WXSS\u4ee3\u7801\uff1a bigWrap{ background:#eee; } \/goTop\u56de\u5230\u9876\u90e8\u56fe\u6807start\/ .com-widget-goTop&nbsp;{ position:&nbsp;fixed; bottom:&nbsp;125px; right:&nbsp;5px; background:&nbsp;rgba(0,0,0,0.48); border-radius:&nbsp;50%; overflow:&nbsp;hidden; [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[19],"tags":[],"class_list":["post-29366","post","type-post","status-publish","format-standard","hentry","category-19"],"_links":{"self":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/29366","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/comments?post=29366"}],"version-history":[{"count":0,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/29366\/revisions"}],"wp:attachment":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/media?parent=29366"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/categories?post=29366"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/tags?post=29366"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}