HTML
<%--
Created by IntelliJ IDEA.
User: fanso2o
Date: 2017/2/28
Time: 16:09
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html ng-app="wechat">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta charset="utf-8">
<title ng-bind="newTitle" style="text-align: center"></title>
<%@ include file="../../common/head.jsp" %>
<link rel="stylesheet" href="/res/wechat/css/v61/styles.css">
</head>
<body ng-controller="activityController as activity">
<div class="preload" id="preload"></div>
<div id="v61">
<div class="container">
<!-- p1 -->
<section class="page p1">
<span class="bottom-bg"></span>
<span class="bg-icon"></span>
<div class="p1-box">
<span class="p1-bg"></span>
<span class="p1-title"></span>
<p class="time-box">活动时间：<span ng-bind="(activity.activityInfo.dateFrom|wxDate) + ' 至 ' + (activity.activityInfo.dateTo|wxDate)"></span></p>
</div>
<div class="top-box">
<div class="logo-box">
<img src="{{activity.activityInfo.picLogo | wxResUrl}}" alt="logo">
</div>
<div class="rules-box" ng-click="activity.showContent = true;"><span></span>活动规则</div>
</div>
<div class="footer-box">
<div class="next-box">
<span class="next1"></span>
<span class="next2"></span>
</div>
<a href="http://dwz.cn/4xAz0d" class="coryright">粉丝魔方Fanso2o.com | 跨界改变生活</a>
</div>
<div class="alert ng-hide" ng-show="activity.showContent">
<div class="p1-alert">
<h3 class="alert-title">活动规则 <span class="close-icon" ng-click="activity.showContent = false;"></span></h3>
<div class="alert-content">
<p ng-bind-html="activity.htmlDes"></p>
</div>
</div>
</div>
</section>
<!-- p2 -->
<section class="page p2">
<span class="p2-top"></span>
<span class="p2-bottom"></span>
<div class="footer-box">
<div class="next-box">
<span class="next1"></span>
<span class="next2"></span>
</div>
<a href="http://dwz.cn/4xAz0d" class="coryright">粉丝魔方Fanso2o.com | 跨界改变生活</a>
</div>
</section>
<!-- p3 -->
<section class="page p3">
<span class="p3-top"></span>
<span class="p3-bottom"></span>
<div class="footer-box">
<div class="next-box">
<span class="next1"></span>
<span class="next2"></span>
</div>
<a href="http://dwz.cn/4xAz0d" class="coryright">粉丝魔方Fanso2o.com | 跨界改变生活</a>
</div>
</section>
<!-- p4 -->
<section class="page p4">
<span class="bottom-bg"></span>
<span class="bg-icon"></span>
<div class="p4-box">
<span class="p4-bg"></span>
<span class="p4-title"></span>
</div>
<div class="draw-btn" ng-if="activity.showDraw" ng-click="activity.activityDraw()"></div>
<div class="footer-box">
<a href="http://dwz.cn/4xAz0d" class="coryright">粉丝魔方Fanso2o.com | 跨界改变生活</a>
</div>
</section>
</div>
</div>
<%@ include file="../../common/foot.jsp" %>
<jsp:include page="../../common/share.jsp"></jsp:include>
<script src="/res/wechat/js/libs/zepto.js/zepto.min.js"></script>
<script src="/res/wechat/css/v61/index.js"></script>
</body>
</html>
js
function scrollFn() {
$(document).on("touchstart", function (event) {
$(".container").addClass('transition');
});
//preventDefault
$(document).on("touchmove", function (event) {
event.preventDefault();
});
function addC(x, y, z) {
$(x).on(y, function () {
$(".container").addClass(z);
})
}
function removeC(m, n, h) {
$(m).on(n, function () {
$(".container").removeClass(h);
})
}
//p1 -- p2
addC('.p1', 'swipeUp', 'to-p2');
addC('.p1 .next-box', 'tap', 'to-p2');
//p2 -- p1
removeC('.p2', 'swipeDown', 'to-p2');
//p2 -- p3
addC('.p2', 'swipeUp', 'to-p3');
addC('.p2 .next-box', 'tap', 'to-p3');
//p3 -- p2
removeC('.p3', 'swipeDown', 'to-p3');
//p3 -- p4
addC('.p3', 'swipeUp', 'to-p4');
addC('.p3 .next-box', 'tap', 'to-p4');
//p4 -- p3
removeC('.p4', 'swipeDown', 'to-p4');
}