[Создание личного сайта] Минимальный способ реализовать функцию вознаграждения

искусственный интеллект глубокое обучение

[Создание личного сайта] Минимальный способ реализовать функцию вознаграждения

Вы можете просмотреть мою личную домашнюю страницу, увидеть эффект -->www.yansongsong.cn/

Адрес сборки личного сайта на github:GitHub.com/Сяо Сун… 

В личном блоге на веб-сайте вознаграждение за спонсорство — это своего рода поддержка и поощрение автора, и это очень распространенная функция. В этой статье мы расскажем об очень простом способе реализации функции вознаграждения.

Практическая демонстрация:

1. Сторона ПК:

 

2. Мобильный

Реализация функции

Реализация функции очень проста, не нужно отдельно внедрять внешние CSS и JS, просто добавьте на свою веб-страницу следующий HTML-код:

<script src="http://static.tctip.com/tctip-1.0.0.min.js"></script>
  <script>  
  new tctip({
    top: '20%',
    button: {
      id: 9,
      type: 'dashang',
    },
    list: [
      {
        type: 'alipay',
        qrImg: '你的支付宝收款二维码图片地址'
      }, {
        type: 'wechat',
        qrImg: '你的微信收款二维码图片地址'
      }
    ]
  }).init()
  </script>

Параметр Описание

  • top

    • 类型: String
    • 默认值10%
    • 含义: Расстояние от верхней части плагина до верхней части страницы.
    • 备注: формат как100pxили10%
  • button

    • 类型: Объект, содержитidиtypeдва подмассива

    • id:

      • 类型: Number
      • 默认值1
      • 含义: представляет цвет изображения
      • 备注: Диапазон значений 1-9
    • type:

      • 类型: String
      • 默认值dashang
      • 含义: китайские иероглифы на кнопке, есть打赏и赞助два
      • 备注: только взятьdashangилиzanzhu
  • list

    • 类型: Array

    • 默认值: []

    • 含义: Конфигурация ключа, награда отображается справа, не может быть пустым

    • 备注: Массив, содержащий до пяти переданных элементов, каждый элемент имеет следующую конфигурацию.

    • type:

      • 类型: String
      • 默认值: никто
      • 含义: Повторный тип
      • 备注: система поставляется с четырьмя типами по умолчанию,alipay,wechat,bitcon,tenpay, если не эти четыре, то можно написать по желанию
    • qrImg:

      • 类型: String
      • 默认值: никто
      • 含义: адрес изображения QR-кода
      • 备注: максимально возможное обрезание белого пространства вокруг изображения.重要但是非必传
    • qrContent:

      • 类型: String
      • 默认值: никто
      • 含义: содержимое QR-кода
      • 备注: иqrImgОдин из двух должен быть пройден. Если этот параметр передан, плагин автоматически сгенерирует QR-код.
    • icon:

      • 类型: String
      • 默认值: никто
      • 含义: значок, включенный в значок Alipay
      • 备注: если тип является одним из четырех системных по умолчанию, этот параметр можно опустить.
    • name:

      • 类型: String
      • 默认值: никто
      • 含义: название платежа, например Alipay, WeChat и т. д.
      • 备注: если тип является одним из четырех системных по умолчанию, этот параметр можно опустить.
    • desc:

      • 类型: String
      • 默认值: никто
      • 含义: фраза под QR-кодом, похожая на大爷行行好какой-то тип
      • 备注: если тип является одним из четырех системных по умолчанию, этот параметр можно опустить.
  • stat

    • 类型: Boolean
    • 默认值: true
    • 含义: Сообщать ли, для пользователя статистики автора
    • 备注: Этот параметр нужен только автору для подсчета использования плагина, и его можно отключить в зависимости от ситуации.

Добро пожаловать в гости к моемуДомойПопробуйте, если вы найдете это полезным, поддержите меня >