原创 前端圖標、工具、框架彙總(持續更新中)
1.動畫animate https://daneden.github.io/animate.css/ 2.圖標 阿里巴巴矢量圖標庫 iconfont https://www.iconfont.cn/ 3.符號 https://www.co
2020-07-06 16:40:17
1
原创 Echarts柱狀圖和折線圖結合
因功能需要，需要體現業務辦理量及環比，故通過echarts的柱狀圖和折線圖結合共同達到該效果； ①柱狀圖因區域數量不確定，爲保證查看的效果，使用dataZoom 組件用於區域縮放； ②折線圖因有正負數，故選擇環比最小和最大值作爲折線圖的起
2020-07-06 16:40:17
10
原创 分頁
自定義分頁插件 html <div class="row"> <div class="col-xs-12 text-center"> <page page-conf="pageConf"></page>
2019-03-03 13:52:50
原创 前端圖標、工具彙總(持續更新中)
1.動畫animate https://daneden.github.io/animate.css/ 2.圖標 阿里巴巴矢量圖標庫 iconfont https://www.iconfont.cn/ 3.符號 https://www.co
2019-02-01 13:48:17
原创 JS正則表達式驗證數字非常全
<script type="text/javascript"> function validate(){ var reg = new RegExp("^[0-9]*$"); var obj = do
2019-02-01 13:48:17
2
原创 ng-class實現模塊自由添加後的自適應
在項目中遇到這樣的情況，在一個大管理模塊下，有多個小模塊，而這些小模塊可以自由添加和刪除，故需要模塊內容自適應，通過ng-class實現該效果，如有遇到類似情況的，希望可以給大家參考； 要求：每行最多3個模塊，均居中顯示； 思路：模塊數量
2019-02-01 13:48:17
原创 Bootstrap 摺疊（Collapse）插件使用且保證一級、二級菜單的選中狀態
關於Bootstrap 摺疊（Collapse）插件的基礎使用見：http://www.runoob.com/bootstrap/bootstrap-collapse-plugin.html 要求： 1、二級菜單中任意一個選中，則一級菜單
2019-02-01 13:48:17
原创 區域聯動自定義
因項目需要，區域需要實現效果中的結果，select的option無法自定義，故通過自定義的div來實現該區域框。具體代碼如下： html <div class="service-list"> <div class="col-xs
2018-12-12 21:00:54
原创 區域聯動自定義div實現select標籤的選擇效果
因項目對區域的樣式有要求，而select標籤的option不能自定義，故通過div實現select標籤的選擇效果。 說明如下： 1.實現點擊文字框和⌵區域框出現，點擊其他地方區域框關閉，通過在該頁面的最大級div(非body)上增加點擊事
2018-12-07 21:23:22
原创 jquery-ui日期插件datepicker僅顯示年月且含有全部按鈕
1.日曆插件僅顯示年月，需要在html中作如下處理： <style type="text/css"> .ui-datepicker-calendar { display: none; } </style>
2018-12-07 21:23:22
3
原创 jquery-ui日期插件datepicker顯示時分
一、日期插件datepicker顯示年月日(見效果一) 引入如下文件： <script src="lib/jQuery/jquery-ui.min.js"></script> <script src="lib/jQuery/jquery
2018-09-17 02:56:34
原创 jquery-ui日期插件datepicker平鋪在頁面
jquery-ui日期插件datepicker一般是在點擊輸入框是彈出時間選擇框，本文實現日期插件datepicker平鋪在頁面。關於datepicker中文顯示及顯示時分秒在後面文章說明。 頁面引入<script src="lib/jQ
2018-09-17 02:56:34
原创 基於canvas的圖片裁剪上傳及刪除
項目需求：欲實現PC端圖片從本地上傳，在裁剪框中裁剪成一定比例的圖片，該圖片會在微信端同步展示，考慮手機的屏幕適配，需要寬度爲640px（只需修改一下參數即可）,本文以寬320px爲例；實現方式：點擊+框，圖片加載在canvas畫布，前端
2018-08-27 15:51:46
2
原创 ng-file-upload實現圖片上傳
通過ng-file-upload這個輕量級、跨瀏覽器的angular上傳文件指令實現圖片上傳，本文對圖片大小有限制，同時附有圖片刪除功能。HTML<div class="form-group marginB15 no-padding">
2018-08-27 15:51:46
1