HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
<meta content="telephone=no" name="format-detection" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<title>demo - pageSlider</title>
<link href="../../Script/plugins/pageSlider1.0/pageSlider.css" rel="stylesheet" />
</head>
<body>
<div class="section sec1" style="background-color:#FFCCCC;">1 移動端中向下滑動<div class="to-form-link"><a href="http://www.baidu.com">我是鏈接</a></div></div>
<div class="section sec2" style="background-color:#4ACBF7;">2</div>
<div class="section sec3" style="background-color:#63E339;">3</div>
<div class="section sec4" style="background-color:#F7D34A;">4</div>
<div class="section sec5" style="background-color:#FF8ECE;">5</div>
<div class="section sec6" style="background-color:#ACDCED;">6</div>
<script src="../../Script/plugins/pageSlider1.0/zepto-1.1.4.js"></script>
<script src="../../Script/plugins/pageSlider1.0/pageSlider1.0.js"></script>
<script>
var pageSlider = PageSlider.case();
//a標簽無法觸發跳轉的問題用以下代碼
$(".to-form-link>a").on('touchend', function () {
location.replace($(this).attr("href"));
});
</script>
</body>
</html>
pageSlider1.0下載
