html实现日历签到页面,jquery每日签到日历插件

这是一款使用jquery来实现的每日签到日历插件源代码。该每日签到插件可以实现签到功能，查看签到次数等，非常实用。

使用方法

在页面中引入样式文件style.css，jquery.min.js和签到js主文件main.js。

HTML结构

签到界面的HTML结如下：

2016年1月6日

我的签到

今日已领0.1元，请明日继续签到

签到规则

首次签到获得0.05元现金奖励

连续签到每天增加0.01元现金奖励

连续签到16天及以上每天获得0.2元现金奖励

其他说明

如果中间有一天间断未签到的，重先开始计算连续签到时间。

连续签到获得奖励后分享到QQ空间、微信朋友圈后再获得一次奖励，每天只限分享一次。

获得的奖励不能直接提现，只能投资后转让变现。

展示我的签到的弹出层界面的HTML结构如下：

连续签到

5
本月签到

17
总共签到数

28
签到累计奖励

30

签到日期奖励说明

2016-1-6 14:23:45	0.20	连续签到19天奖励
2016-1-6 14:23:45	0.20	分享奖励
2016-1-6 14:23:45	0.20	连续签到19天奖励
2016-1-6 14:23:45	0.20	连续签到19天奖励
2016-1-6 14:23:45	0.20	连续签到19天奖励
2016-1-6 14:23:45	0.20	连续签到19天奖励
2016-1-6 14:23:45	0.20	连续签到19天奖励
2016-1-6 14:23:45	0.20	连续签到19天奖励

点击签到后的弹出层的HTML结构如下：

2天

0.55元

分享获取双倍收益

html实现日历签到页面,jquery每日签到日历插件相关推荐

js php 实现日历签到_js实现每日签到功能
本文实例为大家分享了js实现每日签到功能的具体代码,供大家参考,具体内容如下 js: var calUtil = { getDaysInmonth : function(iMonth, iYear){ ...
jquery表格日历写入html,jQuery简单实现日历的方法
本文实例讲述了jQuery简单实现日历的方法.分享给大家供大家参考.具体分析如下: 原理挺简单的,首先算出一个月有多少天,再算出这个月的第一天是星期几,接着顺序排下来就可以了. tryMyOwnCal ...
js php 实现日历签到_Js 实现每日签到打卡轨迹功能。
1.0 核心文件 calendar.js var calUtil = { //当前日历显示的年份 showYear:2018, //当前日历显示的月份 showMonth:1, //当前日历显示的天数 ...
签到体系设计：签到功能该怎么画
编辑导语:如今我们在很多产品上都可以看见签到的功能,签到功能是培养用户习惯的好办法,通过签到吸引用户每天去完成打开APP的动作,这一功能很大程度上提升了用户留存率:本文作者分享了关于签到功能的设计,我 ...
基于jQuery的日历+每日签到功能
公司要开发一个h5页面,里边有一个每日签到抽奖的功能,本以为这样的插件应该会有很多,结果找到的全都是仅生成日历的插件,于是乎就出现了下面这个东西.(前端菜鸟,请大神嘴下留情,也请小伙伴们多提宝贵意见) ...
每日签到html特效,jQuery实现日历每日签到网页特效
本文主要和大家分享jQuery实现日历每日签到网页特效,主要以代码的形式和大家分享,希望能帮助到大家. index.html 代码: jQuery简洁的日历签到插件 $(function(){ //a ...
php mysql实现每日签到积分_php+mysql+jquery实现日历签到功能
在网站开发过程中我们会经常用到签到功能来奖励用户积分,或者做一些其他活动.这次项目开发过程中做了日历签到,因为没有经验所有走了很多弯路,再次记录过程和步骤. 1.日历签到样式: 2.本次签到只记录本月 ...
微信小程序签到页面的日历实现
业务需求:签到页面用日历展示签到情况,只显示当月的. 过期未签的显示灰色字,已签的显示橙色字,当天显示白色字加一个背景图. 1.新建日历组件(取名:calendar) 2.calendar.wxml代 ...
Vue每日签到日历渲染
Vue每日签到日历渲染 `Vue每日签到日历渲染` `先上图` `template` `script` `style` Vue每日签到日历渲染先上图 template <template> ...

html实现日历签到页面,jquery每日签到日历插件

签到规则

其他说明

5

17

28

30

html实现日历签到页面,jquery每日签到日历插件相关推荐

最新文章

热门文章