Shopify页面滑动时底部浮现返回顶部按钮

最新推荐文章于 2024-09-26 17:57:52 发布

佩诺诺

最新推荐文章于 2024-09-26 17:57:52 发布

阅读量666

点赞数 3

分类专栏： shopify 文章标签： css jquery css3

本文链接：https://blog.csdn.net/a19777888/article/details/117326874

版权

本文介绍了如何在Shopify页面中实现在滚动时底部出现返回顶部按钮的功能。提供了两种方法：一是全局应用，通过编辑theme.liquid文件；二是针对特定页面，直接在相应页面代码段中插入代码。

摘要由CSDN通过智能技术生成

Shopify页面滑动时底部浮现返回顶部按钮

两种方法可以实现这种分为独立页面还是所有页面

第一种：概括所有页面

登录shopify打开在线商店找到Online Store右侧所属模板下拉栏选择Edit code

然后找到Layout下的theme.liquid文件（ps：比较建议放到文件最底下例如下图）

源码：

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
		<style>
		*{ margin:0; padding:0; list-style:none;}
		.lanrenzhijia_top{ width:40px; height:40px; position:fixed; right:80px; bottom:35px; z-index:9999; display:none;  background-color: red; }
		.top_arrows {
		    width: 15px;
		    height: 15px;
		    border-top: 4px solid #fff;
		    border-right: 4px solid #fff;
		    transf