前端框架
墨城之左
形而上者谓之道,形而下者谓之器。
展开
-
React 哲学
文章目录从设计稿开发第一步:将设计好的 UI 划分为组件层级第二部:用 React 创建一个静态版本第三部:确定 UI state 的最小(且完整)表示第四步:确定 state 放置的位置第五步:添加反向数据流这就是全部了原文链接:React 哲学这是一篇非常好的文章,它简洁明了的阐述了 React 在前端Web开发中的作用,所谓的哲学,就是它的思维模式。它也很好的讲述了前端设计与前端开发之...原创 2020-03-07 15:23:51 · 1091 阅读 · 1 评论 -
Dygraph 在 display:none 模式下的显示问题
问题描述:图形组件 Dygraph 在显示巨量数据时,非常的轻快,很好用。示例库当图形的 element 容器元素处于隐藏状态时,通过默认的参数是无法正常显示的。查看 dygraph.js 源码发现:// These will be zero if the dygraph's div is hidden. In that case,// use the user-specified ...原创 2020-02-21 11:17:01 · 332 阅读 · 0 评论 -
使用 HTML5 draggable 属性与 CSS 的 resize 属性实现 DIV 的拖拽与缩放
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...原创 2020-02-10 21:09:54 · 1219 阅读 · 0 评论 -
自定义实现 div 元素的 resizable,draggable 功能
本文主要是模拟 jquery ui 提供的 resizable,draggable 功能。使用 jQuery UI 创建 resizable,draggable 仪表盘由于 jquery-ui.css 和 jquery-ui.js 两个文件太大,提供的功能太多,如果仅仅是需要最简单的 resiable 和 draggable 功能,引入 jquery-ui 还设计到跟现有框架的集成问题,甚至会...原创 2020-02-10 11:32:11 · 1279 阅读 · 0 评论 -
使用 jQuery UI 创建 resizable,draggable 仪表盘
网络上有非常多的开源 Dashboard 解决方案,如:15 种构建 Dashboard 的开源解决方案还有一些 grid 框架,可用于定制自己的 Dashboard,例如 gridster,react-grid-layout 等等。但是这些方案都有个共同的问题,就是太复杂,有一定的学习和系统集成的成本,不适合演示性的小工具面板开发。如果你只想花几个小时的时间,来实现一个能够拖拽和缩放的面板,...原创 2020-02-06 17:08:28 · 799 阅读 · 0 评论 -
HTML position 之 absolute relative static fixed
什么是文档流将窗体自上而下分成一行一行,并在每行中按从左至右的挨次排放元素,即为文档流。每个非浮动、块级元素都独有一行, 浮动元素则按规则浮在行的一端。若当时行容不下, 则另起新行再浮动。内联元素也不会独有一行。比如网页的div标签它默认占用的宽度位置是一整行,p标签默认占用宽度也是一整行,因为div标签和p标签是块状对象。一切元素(包括块级,内联和列表元素)均可生成子行, 用于摆放子元...原创 2020-02-03 14:28:52 · 506 阅读 · 0 评论 -
15 种构建 Dashboard 的开源解决方案
文章目录MozaikNode.js DashboardGrapheneWebdashJust dashboardReact DazzleFreeboardCxJSPa11y DashboardTipboardZeu.jsez-DashingSmashingMetriciogdashDashboard 是一种有效的数据展现手段,以下的 15 种工具,可用于构建高效、美观、可交互的 Dashboar...翻译 2020-01-05 15:51:27 · 2698 阅读 · 0 评论