这里介绍10款流行的 jQuery插件,希望能帮上各位前端攻城狮~ fullPage.js 一个简单的,易于使用的插件,创建全屏滚动网站(也被称为单页网站),它允许创建滚动网站以及添加一些水平滑块。 下载插件 …
标签:css3
纯CSS打造Chrome浏览器
Mark Qin用HTML和CSS模拟了一个Chrome浏览器。 Demo在此。 都是一些基本的CSS3的使用,并不复杂。各位有兴趣地可以试着也写一个。 唯一复杂的地方是浏览器标签的模拟。 可以看出,Chrome标签的基…
css按钮交互效果
最近在网上闲逛时,发现了http://www.nows.fun/ 这个毒鸡汤,内容有趣,按钮交互做的也很棒,简约而不简单。于是就把按钮交互的效果拿来学习一下。总体上来说,是利用了:active和box-shadow两个特…
你可能不知道的css骚操作 — 表单验证🤦♂️
效果图 原理 表单元素中,有一个pattern属性,可以自定义正则表达式(如手机号、邮箱、身份证..);valid伪类,可以匹配通过pattern验证的元素;invalid伪类则相反,可以匹配未通过pattern验证的元…
前端每日实战 2018年10月至2019年6月项目汇总(共 20 个项目)
过往项目 2018 年 9 月份项目汇总(共 26 个项目) 2018 年 8 月份项目汇总(共 29 个项目) 2018 年 7 月份项目汇总(共 29 个项目) 2018 年 6 月份项目汇总(共 27 个项目) 2…
【Hello CSS】第四章-HTML的标签与语意
作者:陈大鱼头 github: KRISACHAN 上一篇分享了CSS的逻辑属性与盒子模型中分享了一些有关设备屏幕的知识以及浏览器视口的坐标构成。本篇则会分享HTML相关的一些知识。 我们在序章的开头就简单的讲解了HTM…
CSS3主要内容
CSS3主要内容 一、CSS选择器 CSS3选择器规范地址: https://www.w3.org/TR/2011/RE… CSS3最新选择器规范: https://www.w3.org/TR/sele…
前端每日实战 169# 视频演示如何制作“数略词”交互动画(内含2个视频)
效果预览 按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。 https://codepen.io/comehope/pen/byvRxB 可交互视频 此视频是可以交互的,你可以随时暂停视频,编辑视频中…
Vue Router history模式的配置方法及其原理
始发于我的博客 ryougifujino.com,欢迎访问留言。 vue-router分为hash和history模式,前者为其默认模式,url的表现形式为http://yoursite.com#home,比较难看。后者…
弹窗实现(自制)
自制手写弹窗 在实际开发中,我们不可避免的需要使用到弹窗,但是我们经常总是直接使用的第三方模态框,这就导致我们自己对于弹窗的理解并不深;如果有时候需要我们手写一个简单弹窗时,你可能写不出来(不要笑,大部分都是,包括有些前…
前端每日实战 167# 视频演示如何用 1 个 dom 元素创作两颗爱心
效果预览 按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。 https://codepen.io/comehope/pen/KLvENb 可交互视频 此视频是可以交互的,你可以随时暂停视频,编辑视频中…
【Hello CSS】第二章-CSS的逻辑属性与盒子模型
作者:陈大鱼头 github: KRISACHAN 在上一篇【Hello CSS】的第一章CSS的语法与工作流中介绍了CSS的语法规则以及基本的渲染流程。本篇则会分享CSS的逻辑属性以及盒子模型。 首先开篇之前先提个问题…