![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端学习
Accept_1
这个作者很懒,什么都没留下…
展开
-
Vue 让页面回到顶部
仅仅设置 document.body 可能会有兼容性问题,可如下设置document.body.scrollTop = document.documentElement.scrollTop = 0原创 2020-08-29 17:26:12 · 1141 阅读 · 0 评论 -
Error in v-on handler: “TypeError: this.$confirm is not a function“
在vue项目中从全局引入element-ui改为按需引入后报错解决方法:1 引入messageBox 插件import {MessageBox} from ‘element-ui’2 在vue 的原型对象上挂载confirmVue.prototype.$confirm = MessageBox.confirm原创 2020-08-27 11:59:50 · 5640 阅读 · 1 评论 -
JS实现滑动门特效
效果如图:代码如下:<!doctype html><html><head> <style type="text/css"> body,ul,li,p {margin: 0;padding: 0} ul,ol {list-style: none;} .home-subjects-v2{he...原创 2019-11-23 12:33:51 · 368 阅读 · 0 评论 -
原生实现freeCodeCamp上的Build a Personal Portfolio Webpage
目标网站: 设计一个类似于: https://codepen.io/freeCodeCamp/full/YqLyXB/的个人作品集。完成效果图:心得体会: 一开始最大的困扰是怎么监听滚动滑动,搜索工具是个好东西,用JQuery来操作dom很容易就解决了这个问题。后面编码中的问题主要就是布局里的东西,比如input和textarea的placeholder属性的字体样式默认是不同的,以及输入框怎...原创 2019-11-22 12:56:16 · 717 阅读 · 0 评论 -
如何设置输入框input中placeholder的字体颜色、字号
placeholder属性时css3中新增加的属性,IE9和Opera12以下版本的CSS选择器均不支持占用文本。二、设置placeholder文字颜色、字号 方式1 因为每个浏览器的CSS选择器都有所差异,所以需要针对每个浏览器做单独的设定(可以在冒号前面写input和textarea)。::-webkit-input-placeholder{/*Webkit browsers*/ ...转载 2019-11-22 10:01:50 · 383 阅读 · 0 评论 -
去除input边框以及点击input出现的边框
input type=“text” style=“border:0px;outline:none;”更详细: http://www.yayihouse.com/yayishuwu/chapter/1407原创 2019-11-22 09:47:21 · 808 阅读 · 0 评论 -
子元素margin-top为何会影响父元素?
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声...转载 2019-11-21 16:24:01 · 171 阅读 · 0 评论 -
使设置了position:fixed的元素不与下面的元素重叠
方法一: header设置了position:fixed定位后,下一个div(main)会上移,可以给header部分设置高,然后main设置一个margin-top,可以实现两个div分开,另外设置position:fixed的部分,一定要设置top:0; left:0; 不然会引起margin-top失效。方法二: 在设置了fixed的div下再设置一个空的div,设置成你要占据的高度即可。...原创 2019-11-21 14:53:05 · 6982 阅读 · 0 评论 -
3种方法实现弹幕效果
本文实现弹幕效果的三种方法:1、Canvas实现 2、Jquery实现 3、js原生实现1、Canvas弹幕实现借鉴于:https://segmentfault.com/a/1190000011723466代码如下://index.html文件<!DOCTYPE html><html lang="en"><head> <me...原创 2019-11-09 12:11:05 · 4080 阅读 · 0 评论 -
scrollWidth,clientWidth,offsetWidth的区别
转自: https://www.cnblogs.com/kongxianghai/p/4192032.html通过一个demo测试这三个属性的差别。说明:scrollWidth:对象的实际内容的宽度,不包边线宽度,会随对象中内容超过可视区后而变大。clientWidth:对象内容的可视区的宽度,不包滚动条等边线,会随对象显示大小的变化而改变。offsetWidth:对象整体的实际宽度,包...转载 2019-10-29 08:43:54 · 103 阅读 · 0 评论 -
Build a Tribute Page (bootstrap开发一个简单网页)
目标: 设计一个类似于: https://codepen.io/FreeCodeCamp/full/NNvBQW/的页面。代码+注释如下:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><link rel="shortcut icon" type="image/x...原创 2019-10-24 15:35:28 · 373 阅读 · 0 评论 -
原生JS实现选项卡切换
效果图:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>实践题 - 选项卡</title> <style type="text/css"> /* CSS样式制作 */ *{...原创 2019-10-21 17:25:47 · 134 阅读 · 0 评论 -
原生js实现深拷贝函数
借鉴了一位大佬的想法:https://blog.csdn.net/LL18781132750/article/details/797000891、首先实现一个函数对变量类型进行判断// 判断变量的类型function getType(obj){ var str = Object.prototype.toString.call(obj); // typeof 不能准确判断一个对象变量, ...原创 2019-09-18 22:50:39 · 1129 阅读 · 0 评论