video.js使用 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
html:
<link rel="stylesheet" href="css/video-js.min.css" />
<script type="text/javascript" src="js/video.min.js"></script>

<div class="sleepVideo_box">
    <video id="sleepVideo-player" class="video-js sleepVideo_video" preload="auto" poster="预览图片" playsinline="true" data-setup='{}'>
        <source src="视频路径" type="video/mp4"></source>
    </video>
</div>
poster预览图单个视频可以，多个视频ios会有图片闪烁问题。
可以背景添加预览图
.vjs-poster{background-size: 100% 100%;}
.container .video-js{background: url("../images/videoBg.png") no-repeat;background-size: 100% 100%;}

css:
.vjs-poster{background-size: 100% 100%;}   //poster全屏展示

js:
var sleepVideo_player = videojs('sleepVideo-player', {   //配置
    controls: false,
    children: {
        controlBar: {
            fullscreenToggle: false
        }
    }
}, function onPlayerReady() {
    this.on("ended", function () {

    });
});
sleepVideo_player.play();   //播放
sleepVideo_player.pause();   //暂停
sleepVideo_player.src({ src: "", type: "video/mp4" });   //切换视频

链接：https://blog.csdn.net/a0405221/article/details/80923090

展开全文 >>

Swiper设置slideToClickedSlide没效果 

1
2
3
4
5
6
7
8
9
10
11
12
13
slideToClickedSlide设置为true则点击slide会过渡到这个slide

<script language="javascript"> 
  var mySwiper = new Swiper('.swiper-container',{
    slideToClickedSlide: true,
    centeredSlides : true,
    slidesPerView : 3,
  })
</script>
父元素swiper设置effect : 'fade',会默认pointer-events: none;
单独设置pointer-events: auto;

链接：https://www.swiper.com.cn/api/clicks/207.html

展开全文 >>

Md5签名 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
html与后端接口访问，为了简单的安全验证，需要做一下签名处理

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>MD5签名</title>
</head>
<body>
    <script src="./jquery.js"></script>
    <script src="./md5.js"></script>
    <script type="text/javascript">
        var userId = '0b44baa65b90727f015b9076a38a0001';
        var timestamp = '1558494714737'
        var t1 = userId + timestamp;
        var s1 = $.md5(t1);
        console.log(s1);
    </script>
</body>
</html>

链接：https://jayden.matchcess.com/2019/11/07/java/md5/Java%E5%92%8CJquery%20Md5%E5%81%9A%E6%8E%A5%E5%8F%A3%E7%AD%BE%E5%90%8D/#more

展开全文 >>

H5视频全屏播放 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
html:
<div class="homeVideo_box">
    <video class="homeVideo_video" id="homeVideo_video" webkit-playsinline="true" x5-video-player-type="h5"
        x5-video-player-fullscreen="true" playsinline="true" preload="auto" src="视频路径"
        poster="images/sleepVideo_img1.png"></video>
    <div class="homeVideo_play abs">
        <img src="images/sleepVideo_play.png" class="whImg" alt="">
    </div>
    <div class="homeVideo_jump abs">
        <img src="images/homeVideo_jump.png" class="whImg" alt="">
    </div>
</div>

css:
/* 开始视频homeVideo */
.homeVideo_box{width: 100%;height: 100%;position: absolute;left: 0;top: 0;z-index: 9;overflow: hidden;background: #000;}
.homeVideo_video{width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.homeVideo_play{width: 20%;left: 50%;top: 50%;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);}
.homeVideo_jump{width: 18%;right: 5%;top: 4%;}
video{object-fit: fill;object-position: center center;}

js:
/* 开始视频 */
$(".homeVideo_play").on("click", function () {
    $(".homeVideo_play").hide();
    $(".homeVideo_video")[0].play();
});

/* 开始视频播放完 */
var homeVideo_video = document.getElementById("homeVideo_video");
homeVideo_video.onended = function () {
    $(".homeVideo_box").remove();
};

/* 点击跳过视频 */
$(".homeVideo_jump").on("click", function () {
    $(".homeVideo_box").remove();
});

展开全文 >>

ajax方法封装 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function ajaxGet(url, data, successCallBack, errorCallBack) {
	ajax(url, data, 'GET', "application/json", successCallBack, errorCallBack)
}
function ajaxPost(url, data, successCallBack, errorCallBack) {
	ajax(url, data, 'POST', "application/x-www-form-urlencoded", successCallBack, errorCallBack)
}

function ajax(url, data, type, cType, successCallBack, errorCallBack) {
	$.ajax({
		url: url,
		data: data,
		type: type,
		contentType: cType,
		// dataType: 'jsonp',  jsonp跨域
		// json: 'callback',
		success: successCallBack,
		error: errorCallBack
	});
}

展开全文 >>

小程序接口请求封装 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
1.方法封装（新建文件夹util工具文件，在文件夹下创建request.js文件，用于对方法封装）

var app = getApp();
//这里base URL
var host = 'http://192.168.3.32:8080/';

/**
 * POST请求，
 * URL：接口
 * postData：参数，json类型
 * doSuccess：成功的回调函数
 * doFail：失败的回调函数
 */
function request(url, postData, doSuccess, doFail) {
  wx.request({
    //项目的真正接口，通过字符串拼接方式实现
    url: host + url,
    header: {
      "content-type": "application/json;charset=UTF-8"
    },
    data: postData,
    method: 'POST',
    success: function(res) {
      //参数值为res.data,直接将返回的数据传入
      doSuccess(res.data);
    },
    fail: function() {
      doFail();
    },
  })
}

//GET请求，不需传参，直接URL调用，
function getData(url, doSuccess, doFail) {
  wx.request({
    url: host + url,
    header: {
      "content-type": "application/json;charset=UTF-8"
    },
    method: 'GET',
    success: function(res) {
      doSuccess(res.data);
    },
    fail: function() {
      doFail();
    },
  })
}
/**
 * module.exports用来导出代码
 * js文件中通过var call = require("../util/request.js")  加载
 * 在引入引入文件的时候"  "里面的内容通过../../../这种类型，小程序的编译器会自动提示，因为你可能
 * 项目目录不止一级，不同的js文件对应的工具类的位置不一样
 */
module.exports.request = request;
module.exports.getData = getData;

2.page创建一个文件夹，创建四种文件js里面加入

//引入代码
var call = require("../../utils/request.js")

Page({
  data: {
    pictureList: [],
  },
  onLoad: function () {
    var that = this;
    //调用封装的方法
    call.getData('superplanner/admin/load-companys', this.shuffleSuc, this.fail); //get请求
    // call.request('superplanner/admin/load-companys', {}, this.shuffleSuc, this.fail); //post请求
  },
  shuffleSuc: function (data) {
    var that = this;
    that.setData({
      pictureList: data.data.list
    })
  },
  fail: function () {
    console.log("失败")
  },
})

链接：https://www.cnblogs.com/mica/p/10893031.html

展开全文 >>

tag:

    缺失模块。
    1、请确保node版本大于6.2
    2、在博客根目录（注意不是yilia根目录）执行以下命令：
    npm i hexo-generator-json-content --save

    3、在根目录_config.yml里添加配置： 

      jsonContent:
    meta: false
    pages: false
    posts:
      title: true
      date: true
      path: true
      text: false
      raw: false
      content: false
      slug: false
      updated: false
      comments: false
      link: false
      permalink: false
      excerpt: false
      categories: false
      tags: true

很惭愧<br><br>只做了一点微小的工作<br>谢谢大家