Smart App Banner 开源项目教程

最新推荐文章于 2025-01-09 11:02:50 发布

石顺垒Dora

最新推荐文章于 2025-01-09 11:02:50 发布

阅读量754

点赞数 11

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/gitblog_00598/article/details/141877866

Smart App Banner 开源项目教程

smart-app-bannerLightweight smart app banner with no jquery requirement项目地址:https://gitcode.com/gh_mirrors/smar/smart-app-banner

1、项目介绍

Smart App Banner 是一个轻量级的应用内横幅，不需要 jQuery 或其他框架的支持。它基于 Arnold Daniels 的 'jQuery Smart Banner' 项目，但作为一个独立的模块，可以直接在项目中使用。该项目的主要目的是在移动网站上展示一个横幅，鼓励用户下载或打开相应的移动应用。

2、项目快速启动

安装

首先，通过 npm 安装 Smart App Banner：

npm install --save smart-app-banner

使用

在你的 HTML 文件中引入必要的文件和设置 meta 标签：

<!DOCTYPE html>
<html>
<head>
    <title>MyPage</title>
    <meta name="apple-itunes-app" content="app-id=502838820">
    <meta name="google-play-app" content="app-id=ru.hh.android">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="node_modules/smart-app-banner/dist/smart-app-banner.css" type="text/css" media="screen">
    <link rel="apple-touch-icon" href="apple-touch-icon.png">
    <link rel="android-touch-icon" href="android-icon.png" />
</head>
<body>
    <script src="node_modules/smart-app-banner/dist/smart-app-banner.js"></script>
    <script type="text/javascript">
        new SmartBanner({
            daysHidden: 15, // days to hide banner after close button is clicked (defaults to 15)
            daysReminder: 90 // days to hide banner after "VIEW" button is clicked (defaults to 90)
        });
    </script>
</body>
</html>