
前端开发
分享前端开发文章
脉脉情缘
80后大叔
展开
-
JS制作仿博客样式日历,按日期汇总信息
1、html代码 <div class="calendar"> <div class="event-header"> <span class="title"><a href="">活动日历</a></span> <span class="more"><a href="">更多>></a>原创 2021-02-03 09:02:14 · 158 阅读 · 1 评论 -
解决自签名证书在Chrome上的“不是私密连接问题”
一、生成证书1、创建根证书新建MyCompanyCA.cnf文件并输入以下内容:[ req ]distinguished_name = req_distinguished_namex509_extensions = root_ca[ req_distinguished_name ]# 以下内容可随意填写countryName = CN (2 letter code)countryName_min = 2countryName_max转载 2021-02-03 08:47:00 · 2682 阅读 · 2 评论 -
ES6解构表达式
数组解构比如有一个数组:let arr = [1,2,3]我想获取其中的值,只能通过角标。ES6可以这样:const [x,y,z] = arr;// x,y,z将与arr中的每个位置对应来取值// 然后打印console.log(x,y,z);对象解构例如有个person对象:const person = { name:"jack", age:21, language: ['java','js','css']}我们可以这么做:// 解构表达式获取值c原创 2021-02-01 09:24:37 · 166 阅读 · 0 评论 -
部署https证书后,部分http链接资源被blocked的问题
https改造之后,部分第三方资源,如bshare分享、cnzz统计等无法正常加载,在很多页面中会看到如下警报:Mixed Content: The page at 'https://***.html' was loaded over HTTPS, but requested an insecure script 'http://***/b/buttonLite.js'. This request has been blocked; the content must be served over HTTP原创 2021-02-01 09:14:06 · 1021 阅读 · 0 评论 -
Vue动态切换class样式
可以传给 v-bind:class 一个对象,以动态地切换class:<div v-bind:class="{ active: isActive }"></div>上面的语法表示 active 这个 class 存在与否将取决于数据属性 isActive 的 truthiness(所有的值都是真实的,除了false,0,“”,null,undefined和NaN)。可以在对象中传入更多属性来动态切换多个 class。此外,v-bind:class 指令也可以与普通的 clas原创 2021-01-31 11:53:35 · 2625 阅读 · 0 评论 -
CSS命名及书写规范
第一部分 CSS命名规范一、CSS文件命名规范全局样式:global.css框架布局:layout.css字体样式:font.css链接样式:link.css打印样式:print.css二、常用类/ID命名规范页 眉:header内 容:content容 器:container页 脚:footer版 权:copyright布 局:wrapper左右中:left right center导 航:nav菜 单:menu主菜单:mainMenu子菜单:subMenu标原创 2021-01-31 11:52:26 · 2117 阅读 · 0 评论 -
require.js整合bootstrap报错Uncaught Error: Script error for “popper.js“, needed by: bootstrap
使用require.js模块化开发引入bootstrap4时会报错,需在配置require.js时添加map参数,最终解决方案如下:require.config({ baseUrl: 'static/js/', paths: { "jquery": "jquery", "bootstrap": "bootstrap" }, shim: { "bootstrap": ["jquery"] }, map: {原创 2021-01-31 11:51:39 · 2113 阅读 · 0 评论 -
解决framework7 iphone微信端页面文本框输入后页面底部留白问题
代码如下:$$(document).on('page:init', function () { $$('input,textarea,select').on('blur',function(){ this.scrollIntoView(false); });});原创 2019-07-18 10:18:27 · 400 阅读 · 0 评论 -
uniapp框架app端锁定屏幕方向为竖向
app.vue中添加如下js代码<script> export default { onLaunch: function() { // #ifdef APP-PLUS plus.screen.lockOrientation('portrait-primary'); // #endif } }</script>...原创 2019-08-18 11:36:35 · 9118 阅读 · 1 评论 -
uniapp使用讯飞语音输入接口
voice() { var me = this; var options = {}; options.engine = 'iFly'; options.punctuation = false; // 是否需要标点符号 options.timeout = 10 * 1000; plus.speech.startRecognize(options, ...原创 2019-08-18 11:53:11 · 5304 阅读 · 2 评论 -
uniapp绘制自定义顶部导航
startCreateView() { var me = this; me.titleTimer = setTimeout(function() { me.createView(); }, 100); //具体缓迟时间可以按需设置 }, createView() { clearTimeout(this.titleTimer); v...原创 2019-08-21 15:37:58 · 2778 阅读 · 0 评论 -
uniapp中使用百度名片识别接口或名片全能王识别接口
scan() { var me = this; uni.chooseImage({ count: 1, sizeType: ['compressed'], sourceType: ['album', 'camera'], success: function(res) { var tempFilePath = res.tempFi...原创 2019-08-23 14:10:08 · 1892 阅读 · 1 评论 -
uniapp禁止遮罩层下的页面滚动
<view @touchmove.stop.prevent="moveHandle"></view>methods: { moveHandle() {}}原创 2019-09-04 16:47:14 · 10832 阅读 · 4 评论 -
require.js的用法及AMD模块的写法
一、为什么要用require.js?最早的时候,所有Javascript代码都写在一个文件里面,只要加载这一个文件就够了。后来,代码越来越多,一个文件不够了,必须分成多个文件,依次加载。下面的网页代码,相信很多人都见过。 <script src="1.js"></script> <script src="2.js"></script> <script src="3.js"></script> <script sr转载 2021-01-31 11:42:45 · 350 阅读 · 0 评论 -
通过CSS控制标题长度,截断并显示“...”
可通过CSS,控制标题长度超出后的显示样式:overflow:hidden;表示溢出隐藏text-overflow:ellipsis;表示超出后显示…white-space: nowrap;表示不换行.title { width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}...原创 2021-01-31 11:44:18 · 460 阅读 · 0 评论