包罗万象 | 黄良钵博客

jQuery tab选项卡中的瀑布流

ui使用 weui ，主要看js部分，样式只在外盒子上加 position: relative; width : 100%; item元素添加绝对定位和固定宽度 width : calc((100% - 5px) / 2); position : absolute; <div class="weui-tab"> <div class="weui-navbar"> <div data-id="0" class="weui-navbar__item weui-bar__item_on"> 合作酒店 </div> <div data-id="1" class="weui-navbar__item"> 公司团队 </div> <div data-id="2" class="weui-navbar__item"> 会员活动 </div> <div data-id="3" class="weui-navbar__item"> 加盟共赢 </div> </div> <div class="weui-tab__panel">  <div> <div class="store" id="store"> <div class="store-main"></div> </div> </div> <div style="display:none"> <div class="masonry" id="team"> <ul class="masonry-list"> <li class="masonry-item"> <h4 class="masonry-item-tit">公司团队</h4> <img src="img/store/kaiwei.jpg" alt="${j.name}"> </li> <li class="masonry-item"> <h4 class="masonry-item-tit">公司团队</h4> <img src="img/banner/home-swiper1.jpg" alt="${j.name}"> </li> <li class="masonry-item"> <h4 class="masonry-item-tit">公司团队</h4> <img src="img/banner/home-swiper1.jpg" alt="${j.name}"> </li> <li class="masonry-item"> <h4 class="masonry-item-tit">公司团队</h4> <img src="img/store/kaiwei.jpg" alt="${j.name}"> </li> </ul> </div> </div> <div style="display:none"> <div class="masonry" id="activity"> <ul class="masonry-list"> <li class="masonry-item"> <h4 class="masonry-item-tit">会员活动</h4> <img src="img/store/kaiwei.jpg" alt="${j.name}"> </li> <li class="masonry-item"> <h4 class="masonry-item-tit">会员活动</h4> <img src="img/store/kaiwei.jpg" alt="${j.name}"> </li> <li class="masonry-item"> <h4 class="masonry-item-tit">会员活动</h4> <img src="img/banner/home-swiper1.jpg" alt="${j.name}"> </li> <li class="masonry-item"> <h4 class="masonry-item-tit">会员活动</h4> <img src="img/banner/home-swiper1.jpg" alt="${j.name}"> </li> <li class="masonry-item"> <h4 class="masonry-item-tit">会员活动</h4> <img src="img/store/kaiwei.jpg" alt="${j.name}"> </li> </ul> </div> </div> <div style="display:none"> <div class="masonry" id="join"> <ul class="masonry-list"> <li class="masonry-item"> <h4

2019-08-22 14:45:19 9 0 0

阅读详情

宝塔面板使用WebHook 更新nuxt网站

首先在宝塔中安装WebHook插件：然后添加一个Hook 填入名称，规则可以随便填，待会在改提交后，在列表中点击编辑，然后参考下面的代码修改为你需要的 #!/bin/bash echo "" #输出当前时间 date --date='0 days ago' "+%Y-%m-%d %H:%M:%S" echo "Start" #判断宝塔WebHook参数是否存在 if [ ! -n "$1" ]; then echo "param参数错误" echo "End" exit fi #git项目路径就是你服务器网站允许的地址 gitPath="/www/wwwroot/xn__nf1a578axkh_xn__fiqs8s/$1" #git 网址 gitHttp="git@github.com:hlbj105/$1.git" echo "Web站点路径：$gitPath" #判断项目路径是否存在 if [ -d "$gitPath" ]; then cd $gitPath #判断是否存在git目录 if [ ! -d ".git" ]; then echo "在该目录下克隆 git" git clone $gitHttp gittemp echo "git地址：$gitHttp" mv gittemp/.git . rm -rf gittemp fi #拉取最新的项目文件 git fetch --all git reset --hard origin/master git pull #设置目录权限 chown -R www:www $gitPath # 下面是pm2操作 pm2 show # 重启 pm2 进程，其中blog为你需要重启的进程名或者id pm2 restart blog echo "End" exit else echo "该项目路径不存在" echo "End" exit fi 点击保存后，点击查看密钥，保存下WebHook地址 http://面板地址或者ip/hook?access_key=123&param=aaa access_key 为上面的秘钥 param 为你自定义的传值，在脚本中用$1接收，目前用于git项目名然后在github那边设置Hook 点add webhook后，去提交代码试试看有没有成功在宝塔webhook那边有个日志，可以查看是否成功，或者看你网站有没有成功更新

2019-08-12 09:45:43 38 2 0

阅读详情

nuxt使用@nuxtjs/sitemap生成sitemap.xml

依赖于@nuxtjs/sitemap 和 axios ，如果是少量静态页面的话则不需要axios 先安装@nuxtjs/sitemap插件： yarn add @nuxtjs/sitemap axios 然后在 nuxt.config.js 中添加配置 sitemap: { path: '/sitemap.xml', // sitemap文件名，不用改 hostname: 'https://xn--nf1a578axkh.xn--fiqs8s/', // 网址 cacheTime: 1000 * 60 * 60 * 24, // 更新频率，只在 generate: false有用 gzip: true, // 生成 .xml.gz 压缩的 sitemap generate: false, // 允许使用 nuxt generate 生成 // 排除不要页面 exclude: [ '/404' ], // 页面路由 routes (callback) { axios.all([ // blog 分类 axios.get('https://blog.huangliangbo.com/wp-json/xm-blog/v1/menu'), // 文章列表 axios.get('https://blog.huangliangbo.com/wp-json/wp/v2/posts', { params: { page: 1, per_page: 100, _embed: true }, data: { progress: false } }), // 标签 axios.get('https://blog.huangliangbo.com/wp-json/xm-blog/v1/info') ]).then(axios.spread(function (menu, posts, info) { let now = new Date(); now.setHours(now.getHours(), now.getMinutes() - now.getTimezoneOffset()); let indexRoutes = [ { url: '/', changefreq: 'daily', priority: 1, lastmodISO: now.toISOString() } ] let menuRoutes = menu.data.mainMenu.map((data) => { let url = '' if (data.object === 'category') { url = '/category/1?type=' + data.object_id + '&title=' + data.title } if (data.object === 'page') { url = '/page/' + data.object_id } if (data.object === 'post_tag') { url = '/tags/1?type=' +

2019-08-12 09:20:36 30 0 0

阅读详情

js树形结构根据子节点查找父节点

// 根据子节点url查找所有父节点id const cascader2 = [] // 得到父节点 const office = [] // 树形结构数据 function findParent(array, url) { var len = array.length for (var i = 0; i < len; i++) { if (typeof array[i].children === 'object') { // 如若数组元素类型是object，则递归 for (var j = 0; j < array[i].children.length; j++) { if (array[i].children[j].url === url) { const item = this.listTotal.find((n) => n.url === array[i].url) // 数据筛选根据自己需求新增修改 cascader2.unshift(item.url) // 得到的值，如果只要上一级的话直接return item 否则继续查找父级 cascader2 = cascader2 // console.log(item) findParent(office, item.url) return } else { if (typeof array[i].children[j].children === 'object') { findParent(array[i].children, url) } } } } } },

2019-05-17 14:22:33 25 0 0

阅读详情

海南打盅盘传统习俗“游灯”中的打盅盘

最早的打盅盘是由小孩表演的，打盅盘会打很晚，有时候可能到第二天，小孩们都顶不住，现在也没多少小孩学这东西，所以现在很多都是由大人来表演。优酷：http://v.youku.com/v_show/id_XNDA2ODc1NjE2OA==.html?spm=a2hzp.8244740.0.0

2019-02-18 19:02:03 22 2 0

阅读详情

黄良钵祝大家猪年大吉

[video width="960" height="544" mp4="https://cdn.huangliangbo.com/wp-content/uploads/2019/02/WeChat_20190204201935.mp4" loop="true" autoplay="true"][/video]

2019-02-04 20:23:15 18 4 0

阅读详情