前言 这次要做的 Web 前端实战是一个 Gitee 个人主页下的贡献图(在线 Demo),偶尔做一两个,熟悉熟悉 JS 以及 jQ.整体来说这个案例并不难,主要是控制第一个节点以及最后一个节点处于星期几:且必须保持365个节点. 开始 布局设计 整体的布局是上下,顶部一个 div.下面一个 div.下面的 div 是左右布局,左边是星期.右边是贡献节点.一列贡献节点一共有7个(不一定每一列都是7个).星期要与每一行贡献节点保持平行.左右布局的高度保持一致,因此,每一个贡献节点的宽和高就取自布局…

前言 在<Canvas 线性图形(五):多边形>实现了绘制多边形的函数.本篇文章将记录如何绘制雷达图.最终实现的效果是这样的: 绘制雷达图 雷达图里外层 如动图中所示,雷达图从里到外一共有 6 层,所以,我们需要改造绘制多边形的函数: 点击查看绘制基础雷达图代码 function calcPolygonX(radarX, radius, increaseAngle) { return radarX + radius * Math.cos(increaseAngle); } function c…

前言 在Canvas 线性图形(五):多边形实现了绘制多边形的函数.本篇文章将记录如何绘制雷达图.最终实现的效果是这样的: 绘制雷达图 雷达图里外层 如动图中所示,雷达图从里到外一共有 6 层,所以,我们需要改造绘制多边形的函数: 点击查看绘制基础雷达图代码 function calcPolygonX(radarX, radius, increaseAngle) { return radarX + radius * Math.cos(increaseAngle); } function calc…

———————————— 我的软件开发生涯 (10年开发经验总结和爆栈人生) 爆栈人生 现在流行说全栈.每种开发都有其相关的技术.您是否觉得难以罗列某种开发所包括对技术(技术栈)呢?   您是否想过:   我做的这个职业,究竟包含哪些技术呢? 我所掌握的技术这个子集,在整个技术大系这个超集里面占的比例是多少呢? 我究竟还没有掌握多少技术呢? 面试的时候会考哪些技术呢? 那么,开发是否也应该有这样的技术栈概览图呢?   我搜索了很久,没有找到一个符合我要求的“较为全面”地表述各种技术大系的图表.所…

前言 这是一篇个人练习 Web 前端各种常见的控件.组件的实战系列文章.本篇文章将介绍个人通过 JQuery + 无序列表 + CSS 动画完成一个简易的树形控件. 最终实现的效果是: 这样结构比较复杂的嵌套再嵌套的 HTML 结构必须先写一个静态的观察,不可能一步到位,事情是逐渐发展的.遵循自顶向下.逐步求精.模块化三个原则. 静态实现 HTML 点击查看 HTML 代码 <ul class="category"> <li class="category-…

现状 在CAD看图过程中我们经常会需要用到查找文字的功能,在AutoCAD软件查找一个文字时,可以通过打开左下角输入命令find,输入查找的文字,然后设置查找范围,就可以搜索到需要查询的文字.但在Web网页端打开CAD图查找文字时,有没有同样的办法呢?另外,如果有没有办法实现在很多图纸中像百度那样做到全文检索的功能? 实现思路 CAD图Web打开展示 拿之前分享的一款开源的利用最新技术栈Vue3开发的 唯杰地图云端图纸管理平台为例. 他实现了对AutoCAD格式的DWG图纸的云端管理查看功能.能…

快装WebApp项目(Web移动端开发案例)webapp移动端项目源码.html5+css3实战案例分享.微信端H5实例开发 简介快装WebApp是一个面向移动端的快速装修app,此项目为手机端:使用HTML5+css3+zepto+jQ开发,特效方面用到了css3里的过渡transition和动画transform,还用到了iscroll上拉刷新.下拉加载功能,swiper区块轮播效果. 效果截图:               …

实现过程 实现一个简易的鼠标悬停菜单项显示其子项的下拉框控件.将用到 CSS 绝对定位.流式布局.动画等:JQuery 鼠标移入和移出事件.DOM 查找.效果图如下: HTML 结构: <div class="dropdown-group"> <div class="dropdown"> <div class="label">菜单1</div> <div class="items&q…

你要的移动web前端都在这里! 大前端方向:移动Web前端.Native客户端.Node.js. 大前端框架:React.Vue.js.Koa 跨终端技术:HTML5.CSS 3.JavaScript 跨平台框架:React Native.Cordova 前端工程化:Grunt.Gulp.Webpack 前端预编译:Babel.Sass.Less 自动化测试:Jasmine.Mocha.Karma 一图在手,应有尽有! iKcamp原创新书<移动Web前端高效开发实战>已在亚马逊.京东.当当开…

很多同学想学习WEB前端开发,虽然互联网有很多的教程.网站.书籍,可是却又不知从何开始如何选取.看完网友高等游民白乌鸦无私分享的原标题为<写给同事的前端学习路线>这篇文章,相信你会有所收获. 前端开发入门学习有:HTML.CSS.JavaScript(简称JS)这三个部分.所以在学习之前我们需要先明确三个概念: HTML--内容层,它的作用是表示一个HTML标签在页面里是个什么角色. CSS--样式层,它的作用是表示一块内容以什么样的样式(字体.大小.颜色.宽高等)显示. JS--行为层,它的…