- 博客(44)
- 收藏
- 关注
RSS订阅原创 vue父子间的那些事儿——子组件调用父组件的方法
一、子组件调用父组件1、最直接的办法，使用this.$parent.event来直接调用父组件方法。this.$parent.event2、方法是在子组件里用$emit向父组件触发一个事件，父组件监听这个事件就行了// 父组件<children @fatherMethod="fatherMethod"></children>.....fatherMethod(){ ......}// 子组件<el-button @click="
2022-04-21 14:58:28
2404
原创 使用v-model实现父子数据双向绑定
场景：面板的收起与展开功能。效果：页面结构：// 父级 <p>物资保障 <ZoomBtn v-model="shrinkCurPageFlag"></ZoomBtn> </p> <div v-show="!shrinkCurPageFlag"> ....... </div> .... private shrinkCurPageFlagb = false; ..
2021-03-31 19:33:09
179
原创 iframe + postMessage 实现跨域通信的相关问题
页面结构父级页面：a.vue ； 嵌套iframe的URL： http://a/iframe.page.html；a.vue代码如下：<template> <div> <p> 这是主界面，嵌套IFrame页面 </p> <iframe src="http://a/b/iframe.html" id="contentIframe"> </if..
2021-03-27 00:12:18
129
原创 git 操作使用文档
npm config set registry URL从git上down代码$ git clone 地址查看当前分支状态$ git status查看远程主机信息,查看远程仓库地址$ git remote -v
2021-03-26 15:51:23
903
1
原创 vue+element-UI创建工程
1、全局安装vue-cli$ npm install -global vue-cli2、创建一个基于 webpack 模板的新项目$ vue init webpack 项目名3、按照提示一步步操作，如下图：4、手动安装ajv$ npm install ajv@^6.0.0 ...
2018-06-11 12:56:03
2171
原创 关闭webpack的自动更新
修改webpack.dev.conf.js配置文件如下：再注掉如下几个插件，如下图在package.json文件中，去掉--inline。如下图这样就能把自动更新给关闭了。
2018-05-16 14:50:52
3985
转载 HTML CSS 特殊字符表
HTML有许多特殊的字符，您对此有多少了解？平时在WEB制作中，您又有用到多少？或者说你在平时使用之时，是否也会碰到，有许多特殊字符要如何打印出来？比如说“笑脸”，比如说“版权号”。要是你用时忘记了这些特殊字符，不要紧，请记住今天这个地址，你就随时可以查到这些特殊字符的表示方法。简单的介绍一下其使用方法：1、这些字符属于unicode字符集，你的文档需要声明为”utf-8“2、列表符号后面有两列编...
2018-05-15 16:29:47
1833
原创 使用a做锚点链接时，offset().top重复点击时位置不同的问题。
功能 ：最近做了一个简单的功能，文章的内容导航，类似百科的右侧导航。考虑用锚点来实现，整个页面要求单屏显示。点击右侧的导航来定位左侧的内容位置。首先，想到的办法就是，通过右侧点击获取当前左侧锚点的对象，把它的offset().top，赋值给右侧的父级的srcollTop，就OK了。问题：但是问题出现了，导航在第一次点击时，内容能正常链接过去，第二次再点击时内容的位置就不正常了。每次点击锚点时，因为...
2018-05-11 10:43:57
2219
原创 vue引入第三方插件时间格式转换comment
1. 安装moment。cmd命令行进入到项目的目录 npm install moment --save2. 引入。在入口文件main.js中全局引入，然后把插件绑到Vue的prototype上 import moment from 'moment' Vue.prototype.$moment = 'moment'3. 在项目中直接用。this是Vu...
2018-04-25 15:49:17
2630
原创 在vue中引入jquery库
1，cmd打开命令行，进入到项目所在目录下，在命令行输入 ‘npm istall jquery --save ’2, 修改配置文件build文件夹——>打开 webpack.base.conf.js 文件，把下面的代码放到如图位置var webpack=require('webpack')plugins:[ new webpack.ProvidePlugin({ $:'jque...
2018-04-25 09:45:41
489
原创 postCss的学习
学习css预处理器１、准备工作。安装node.js。2、window+r 运行命令行，输入’cmd‘，打开命令行。进入项目工程目录盘，举例：我的项目放在E 盘mywork文件夹里。在命令行输入e:回车进入e盘目录。再输入cd mywork，进入到项目目录。3、在命令行安插postcss插件。输入如下内容回车。npm install postcss-alias p
2017-05-26 14:48:34
955
原创 小三角带边框带阴影的div——css实现效果
第一种情况：带边框的小三角乍一看，很简单，做小三角，首先想到的是利用border的transparent特性，可以制作出小三角的效果。但是注意，这个小三角本身就是边框制作出来的。怎么能在小三角的外边再加一层小边框呢。那就必须再叠加一层一样的东西，让两者有1px的错位。问题就解决了。不想在页面添加多余的无意义的标签，还想实现这个效果。首先想到的就是用元素的伪类来实现。原理就是这样，废话不多说，上
2016-12-14 15:52:20
11052
5
原创 javascript的基础学习笔记
数据类型：分为基础数据类型和复合数据类型。基础数据类型的特点：分不开，不可分数字： var a=12; //12不可分，如分成2个6，那么6还是数字。字符串：var a='12';//字符串也不可分，分开的话还是两个字符串。布尔值：2个值，true/false末定义：undefined复合数据类型：可以分，分成基础数据类型。对象：object函数
2016-04-25 11:49:11
492
转载 css hack整理
浏览器的兼容性一直是个头疼的问题，使用“欺骗”技术可使各个浏览器效果一致，花了些时间整理了各个浏览器的HACK，主要包括IE系列和最新版本的Chrome、Safari、Firefox、 Opera，比较全面的记录下Hack，内容包括3部分：媒体查询 hack、属性Hack、选择器Hack，这些Hack已经测试并得到有效运用，有需要的同学可以放心使用，笔者会在以后不断的更新，如果有需要补充或者修改的
2016-03-04 16:09:01
400
转载 如何实现背景透明，文字不透明，兼容所有浏览器？
重点内容入口：IE6和部分IE7内核的浏览器会读懂rgbaIE专属滤镜 filter:Alpha的兼容处理背景透明，文字不透明全兼容方案测试浏览器：VirtIE6、虚拟机下XP的IE6、纯正IE8、纯正IE8下QQ浏览器、WIN7下的IE 9.0.32 、WIN8下的IE 10.0.21、chrome 38.0 、QQ浏览器8.0-IE10.0.5、safari 5.1.7、ope
2016-03-04 15:38:46
958
原创 弹性运动——学习笔记
运动在js中，只需要开了个定时器，并且不断的改变对象的left和top值就可以了。当然，对象的CSS必须是相对定位的 在运动过程中，距离和速度决定物体的快慢。
2016-02-22 14:26:48
480
转载 由浅入深漫谈margin属性
作者：怿飞 原地址：http://www.planabc.net/2007/03/18/css_attribute_margin/2007-3-18 上午 - HTML/CSS/XML/XSL - CSS - margin margin 在中文中我们翻译成外边距或者外补白（本文中引用外边距）。他是元素盒模型（box model）的基础属性。一、ma
2015-10-27 13:57:36
511
转载 不要告诉我你懂margin
出自 海玉的博客 本文地址: http://www.hicss.net/do-not-tell-me-you-understand-margin/你真的了解margin吗？你知道margin有什么特性吗？你知道什么是垂直外边距合并？margin在块元素、内联元素中的区别？什么时候该用padding而不是margin？你知道负margin吗？你知道负margin在实际工作中的用途吗？
2015-10-27 13:46:52
395
原创 js中阻止默认事件，阻止冒泡事件
阻止默认事件1、在javescript中，return flase可以阻止默认事件，但必须加在onmousedown事件中，down的事儿干完了，再加return flase。2、在自定义函数addEvent中，return flase会失效，请使用事件对象来进行阻止。ev.preventDefault();//阻止默认事件。3、在低版本的IE中这些都不好使，需在onmouse
2015-10-26 20:54:04
3489
原创 自定义滚动条
在页面制作中，开发人员会各种偷懒（我本人就很懒），觉得能用原生的就用原生的，否则会很麻烦。最后还是会被追求美感的设计师抓住不放。经常听到‘‘怎么没有做成设计图上的样子呢..这个自带的滚动条多丑呀，必须要做成设计图上的样子...”通常这种情况我再会先跟设计解释，原生的怎么怎么好用,尽量说服他们。有时会碰到一些固执的设计师，我只坐下来嗷嗷的写代码了。今天先记录一下自定义滚动条的效果。思考：滚动
2015-10-21 20:58:42
2905
转载 IE的layout属性详解
转载雨中无伞-----WEB前端开发http://www.cnblogs.com/yuzhongwusan/archive/2012/03/09/2387052.html要想更好的理解 css， 尤其是 IE 下对 css 的渲染，haslayout 是一个非常有必要彻底弄清除的概念。大多 IE下的显示错误，就是源于 haslayout。什么是 haslay
2015-10-21 18:24:03
398
转载 display:inline-block/text-align:justify下列表的两端对齐布局
by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=1514一、何为列表元素的两端对齐布局首先说说何为两端对齐。下面这个截图是word中一段英文左对齐的右边缘截图：可以看到右侧是参差不起的，现在，选中文字，点击word上方的两端对齐按钮，如下图
2015-09-15 20:39:05
1160
转载 IE7浏览器下CSS属性选择器二三事
by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=4843一、为何专门说起IE7以前，或者说数年前，我们从事桌面端网页开发的时候，基本上都还要兼顾IE6浏览器, 即使有些特性，IE7支持，我们也会忽略之。于是，我们会不自然地把IE6和IE7浏览器
2015-09-15 19:22:57
1242
转载 CSS相对定位|绝对定位(五)之z-index篇
by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=1855一、海边拾贝z-index属性目前只有在position:relative、position:absolute和position:fixed参与的情况下才有作用，表示层级，类似ph
2015-09-15 14:10:58
1066
转载 CSS 相对/绝对(relative/absolute)定位系列（三）
by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=1528一、absolute正业之元素隐藏元素隐藏与显示是我们在页面制作与交互效果实现中非常常见的，如果您只是使用display:none与display:block/inline来实现D
2015-09-15 13:36:26
702
转载 CSS 相对/绝对(relative/absolute)定位系列（二）
by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=1330一、常见absolute布局的替代实现方案absolute属性配合left/top/right/bottom属性具有极强的定位性。这种功能特性是如此的明显与强烈，可能会让页面重构人
2015-09-15 13:34:33
528
转载 CSS 相对|绝对(relative/absolute)定位系列（一）
by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=1287一、有话要说以前写内容基本上都是：眼睛一亮——哟呵，这个不错，写！然后去古人所说的茅房里蹲会儿，就有写作的思路了。但是，构思相对/绝对(relative/absolute)定位系列
2015-09-15 13:32:47
847
转载 CSS 相对/绝对(relative/absolute)定位系列（四）
by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=1834前三篇(1, 2, 3)都是介绍的absolute属性，终于，轮到本文讲讲relative相对定位。一、relative属性的形象化思维relative是个看上去低调，有些特殊才能，气
2015-09-15 13:31:13
1214
转载 你应该知道的一些事情——CSS权重
本文由99根据Vitaly Friedman的《CSS Specificity: Things You Should Know 》所译，整个译文带有我们自己的理解与思想，如果译得不好或不对之处还请同行朋友指点。如需转载此译文，需注明英文出处：http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-shou
2015-09-09 16:08:39
505
转载 CSS3 选择器——属性选择器
上一切在《CSS3选择器——基本选择器》中主要介绍了CSS3选择器的第一部分，这节主要和大家一起来学习CSS3选择器的第二部分——属性选择器。属性选择器早在CSS2中就被引入了，其主要作用就是对带有指定属性的HTML 元素设置样式。使用CSS3属性选择器，你可以只指定元素的某个属性，或者你还可以同时指定元素的某个属性和其对应的属性值。从上一节展示的CSS3选择器的图表中，我们可以知道，CS
2015-09-09 15:07:09
3659
转载 CSS3 选择器——基本选择器
CSS的选择器，我想大家并不会陌生吧，因为天天在使用，但对于CSS3的选择器，要运用的灵活到位，我想对很多朋友还是一定的难度，特别是CSS3中的:nth选择器。那么从现在开始我们先丢开他们版本的区别，从头一起来看看CSS选择器的运用。CSS是一种用于屏幕上渲染html，xml等一种语言，CSS主要是在相应的元素中应用样式，来渲染相对应用的元素，那么这样我们选择相应的元素就很重要了，如何选择对应
2015-09-09 14:38:09
1134
转载 css ie6,ie7,ie8 兼容性写法,CSS hack写法
================================================================================三、CSS hack写法 书写顺序为FireFox在最前，其次是IE8、IE7，最后是IE6。 color:red;//所有浏览器 color:blue\9;//所有IE
2015-08-31 17:54:11
9714
原创 div拖拽时取消文字选中默认事件的解决方法
当我们对div进行拖 拽时，会发现把div里的文字也选中了，其实我并不想选中文字 ，怎么解决呢？我们分两种情况说，一种情况是直接给对象加事件如obj.onmousedown； 另外一种是为对象绑定事件addEventListener。先说第一种：比较简单，高版本的浏览直接加return false来阻止默认事件，低版本的IE系列则用obj.capature&&obj.capature();
2015-08-27 15:00:22
9533
1
原创 制作TTF格式的字体
字体制作1、绘制矢量图形，注意路径必须是闭合的，否则会给后续工作带来麻烦。通过AI,导出“增强型图元文件”.emf格式的文件。2、用CorelDRAW打开，打开“排列”菜单—“修正”调出“焊接面板”。然后选中图形，点击“焊接至”，当鼠标变成如图形状，点击图形的任意部位，完成焊接。最后再调整图形的大小，尽量充满工作区。 然后“导出”，给字体组写上第一名称（汉字命名
2015-08-06 16:06:34
10500
转载 准确理解CSS clear:left/right的含义及实际用途
准确理解CSS clear:left/right的含义及实际用途by zhangxinxu fromhttp://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=4179零、说点什么好久没更新了。并不是在折腾什么大作，而是广度学习与实践中，加上婚礼等诸多大事，所以产出较少。今天这篇也只是小作，博
2015-03-27 11:33:13
583
转载 JS获取各种高度宽度、浏览器窗口滚动条的位置、元素的几何尺寸
代码如下: js获取height和width总结 $(document).ready(function() { alert("浏览器当前窗口可视区域高度:"+$(window).height()); //浏览器当前窗口可视区域高度 alert("浏览器当前窗口文档的高度:"+$(document).height()); //浏览器当前窗口文档的高度 ale
2015-03-24 20:41:07
7719
原创 <label>标签for属性的使用
标签for属性的使用定义和用法for 属性规定 label 与哪个表单元素绑定。隐式和显式的联系标记通常以下面两种方式中的一种来和表单控件相联系：将表单控件作为标记标签的内容，这样的就是隐式形式，或者为 标签下的 for 属性命名一个目标表单 id，这样就是显式形式。例：显式的联系：显式形式将文本 "Social Security Number:" 和表单的社会安全号
2015-03-24 20:12:38
968
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人