hf_872914334
hf_872914334

调整html元素大小 resize

1、使用css属性：resize

div{ resize: both;}

resize 属性规定是否可由用户调整元素的尺寸。

取值：

none：默认，用户无法调整元素的尺寸。
Both：用户可调整元素的高度和宽度。
Horizontal：用户可调整元素的宽度。
Vertical：用户可调整元素的高度。

缺点：不支持ie！仅Firefox 4+、Chrome 以及 Safari 支持 resize。

2、自己造一个轮子

使用拖拽改变元素大小。
调整html元素大小 resize_第1张图片
以上图为例，父层div包裹着内容区，在父层div里还有三个div，分别位于父层div的下方，右方及右下方。拖拽下方div可改变父层div的高度，拖拽右方div可改变父层div的宽度，拖拽右下方div可改变父层div的宽度及高度。

//代码实现

<html lang="zh">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>resizetitle>
    <style>
        .myResize{
            width: 300px;
            height:300px;
            position: relative;
            border-top: 3px solid #00f;
            border-left: 3px solid #00f;
        }
        .myResize .bottom,
        .myResize .right,
        .myResize .bottom-right{
            position: absolute;
            background: #00f;
        }
        .myResize .bottom{
            width: calc(100% - 6px);
            height:3px;
            bottom:0;
            cursor: s-resize;
        }
        .myResize .right{
            width: 3px;
            height:calc(100% - 6px);
            right:0;
            cursor: e-resize;
        }
        .myResize .bottom-right{
            width: 6px;
            height:6px;
            right:0;
            bottom:0;
            cursor: se-resize;
        }
        .myResize .content{
            width: calc(100% - 3px);
            height: calc(100% - 3px);
            position: absolute;
            background: #efefef;
        }
    style>
head>
<body>
    <div class="myResize">
        <div class="bottom">div>
        <div class="right">div>
        <div class="bottom-right">div>
        <div class="content">div>
    div>
    <script>
        function resize(option){
            option = option || {};
            var minWidth = parseInt(option.minWidth) || 5,//最小宽度，未设置则默认5
                minHeight = parseInt(option.minHeight) || 5,//最小高度，未设置则默认5
                el = document.querySelector(option.el),
                hasWidth,
                hasHeight;
            el.draggable = false;
            el.parentNode.draggable = false;
            switch(option.type){
                case 'bottom':hasHeight = true;break;
                case 'right':hasWidth = true;break;
                case 'bottom-right':hasWidth = true;hasHeight = true;break;
                default:return;
            }
            el.onmousedown = function (e) {
                //鼠标按下，计算当前元素距离可视区的距离
                if(hasWidth){
                    var disX = e.clientX;
                    var w = parseInt(window.getComputedStyle(el.parentNode).width);
                }
                if(hasHeight){
                    var disY = e.clientY;
                    var h = parseInt(window.getComputedStyle(el.parentNode).height);
                }
                document.onmousemove = function (e) {
                    var ew,eh;
                    //通过事件委托，计算移动的距离
                    if(hasWidth){
                        var tx = disX - e.clientX;
                        ew = w-tx;
                        el.parentNode.style.width = (ew'px';
                    }
                    if(hasHeight){
                        var ty = disY - e.clientY;
                        eh = h-ty;
                        el.parentNode.style.height = (eh'px';
                    }
                    //回调函数
                    option.callBack && option.callBack(ew?ew:eh,ew?eh:null);
                };
                document.onmouseup = function (e) {
                    document.onmousemove = null;
                    document.onmouseup = null;
                };
            };
        }
        function callBack(w,h){
            console.log(w,h)
        }
        ['bottom','right','bottom-right'].forEach(function(item,index){
            resize({
                el:'.'+item,
                type:item,
                callBack:callBack//回调函数
            })
        })
    script>
body>
html>

vue自定义resize指令，拖拽改变父元素高度

Vue.directive('dragsize',//自定义指令
    {bind:function (el, binding, vnode) {
            el.draggable = false;
            el.onmousedown = function (e) {
                el.parentNode.draggable = false
                //鼠标按下，计算当前元素距离可视区的距离
                let disY = e.clientY;
                let h = parseInt(window.getComputedStyle(el.parentNode).height);
                document.onmousemove = function (e) {
                    //通过事件委托，计算移动的距离
                    let t = disY - e.clientY;
                    el.parentNode.style.height = ((h+t)<5?5:(h+t)) + 'px';//最小宽度，默认5
                    //回调函数
                    binding.value(h+t)
                };
                document.onmouseup = function (e) {
                    document.onmousemove = null;
                    document.onmouseup = null;
                };
            };
        }
    }
);

你可能感兴趣的:(小案例)

  • python曲线回归小案例教程 jackispy python回归开发语言
    一、曲线回归的定义曲线回归是一种统计方法，用于建立自变量（独立变量）和因变量（依赖变量）之间的非线性关系模型。与线性回归不同，线性回归假设自变量和因变量之间的关系是线性的，即可以通过一条直线来描述数据点的趋势；而曲线回归则允许这种关系是非线性的，可能表现为曲线、抛物线、指数、对数或其他复杂的数学形式。其主要特征如下：非线性关系：曲线回归适用于那些不能用直线来充分描述的数据关系。它允许模型以曲线形式
  • 【Python数据分析五十个小案例】使用自然语言处理（NLP）技术分析 Twitter 情感 小馒头学python python数据分析自然语言处理
    博客主页：小馒头学python本文专栏:Python爬虫五十个小案例专栏简介：分享五十个Python爬虫小案例项目简介什么是情感分析情感分析（SentimentAnalysis）是文本分析的一部分，旨在识别文本中传递的情感信息，例如正面、负面或中立情绪。为什么选择Twitter数据数据丰富：Twitter上每天产生数百万条推文，内容多样。即时性：适合实时分析。公开可用：提供API可轻松访问。NLP
  • Vue.js 新手必看：5个趣味小案例快速理解数据绑定原理 云资社 VUEvue.js前端javascript
    Vue.js是一个渐进式JavaScript框架，用于构建用户界面。其核心特性之一是数据绑定，它允许开发者通过简单的声明式语法将数据与DOM元素绑定在一起。这种双向数据绑定机制使得数据更新和视图更新变得非常直观和高效。本文将通过5个趣味小案例，帮助Vue.js新手快速理解数据绑定的原理和实现方式。案例1：简单的文本绑定目标将输入框中的内容实时显示在页面上。实现代码Vue数据绑定-文本绑定输入框内容
  • 微信小程序开发学习笔记——3.6【小案例】熟练使用事件与数据绑定取随机值 Qy_cm 小程序开发学习笔记微信小程序学习笔记
    >>跟着b站up主“咸虾米_”学习微信小程序开发中，把学习记录存到这方便后续查找。课程连接：https://www.bilibili.com/video/BV19G4y1K74d?p=20点击时模块颜色发生改变，并产生随机数。一、代码event.wxss中添加如下代码.box{margin:50rpx;width:200rpx;height:200rpx;background:pink;color
  • python中yield的用法详解——最简单，最清晰的解释 未末0902 pythonpythonpycharm爬虫
    python-迭代器与生成器-笔记1前言一、什么是迭代器与生成器?1.可迭代对象2.可迭代对象有哪些?3.迭代器二、什么是列表推导式?1.列表推导式;2.yield关键-->生成器函数使用生成器实现斐波拉契数列手动关闭当前生成器，关闭之后不能再继续生成值*3.小案例:总结前言提示：这里可以添加本文要记录的大概内容：提示：以下是本篇文章正文内容，下面案例可供参考一、什么是迭代器与生成器?1.可迭代对
  • Orleans7.0 游戏服务器全栈开发实战 unity
    本课程目标是从零开始搭建一套基于微软Orleans和DotNetty开源方案的游戏服务器框架，框架遵守Actor模型，可以充分利用多核，方便水平扩展。并且使用.NET平台，开发和部署都非常便捷。为了演示功能，也实现了一个简单的Unity客户端框架，最后使用这个框架实现了一个井字棋的对战小案例，来教会大家学以致用。这个案例演示了如何登录、开房间、匹配、对战、结算以及断线重连等一系列回合制游戏的关键节
  • 分词实现小案例 CodingBrother 性能优化架构架构中文分词
    MySQL并不是一个专门设计用于处理自然语言处理（NLP）或文本分词的数据库，但可以通过一些方法和技巧实现基本的分词功能，尤其是在处理中文文本或其他语言的应用场景中。以下是一些在MySQL中实现分词的常用方案和设计策略。1.使用FULLTEXT索引MySQL提供了FULLTEXT索引，允许在文本字段上进行全文搜索。此功能可以在英文等语言中有效支持分词。创建FULLTEXT索引CREATETABLE
  • Python小案例：数字炸弹游戏（优化版） Marilynhom #Python基础案例python游戏windows
    优化内容上次所写的数字炸弹案例中所留了的bug：  a.两次死循环，其实可以只用一次的；☑  b.如果其中一个人输入的数据是无效的后游戏将会重新开始，规则上来讲是直接淘汰该玩家☑本次利用列表坐标name_Nub叠加，和一个continue就解决了，具体代码如下：#数字炸弹游戏#1、首先由用户输入一个范围猜取的范围初始值start_Value、end_Value和一个数字作为炸弹Bombs；star
  • Flutter学习案例分享-计数器小案例 Mr.L70517 Flutter案例学习flutter学习
    Flutter框架基础概念简介Widget,Element和RenderObject类型虽然Widget是开发人员创建和管理的，但Flutter框架会并行构建和管理另外两棵树，称为元素树和渲染对象树。这三种树用于构建用户画面（UI）并决定何时刷新他们。StatelessWidget这种widget不需要可变状态。最适合用于描述UI中永不可改的部分。StatefulWidget这种widget具有可
  • QT学习小案例 Liguopi666 qt学习
    dialog.h#ifndefDIALOG_H#defineDIALOG_H#include#include#include#include#includeQT_BEGIN_NAMESPACEnamespaceUi{classDialog;}QT_END_NAMESPACEclassDialog:publicQDialog{Q_OBJECTpublic:Dialog(QWidget*parent=
  • vue3实现搜索关键字高亮 前后端都会点儿 javascriptvue.js前端
    其实这个需求非常常见，平时用app、浏览网页时都能用到，那具体是怎么实现的？我做了小案例，先看下效果我们先梳理下这个需求获取搜索关键字，并过滤出符合条件的数据匹配出要高亮的关键字增加样式那其实关键点就在于怎么匹配，如何高亮？这里我们使用正则匹配，再用replace替换，replace的第二个参数也可以是函数，接受的值就是正则匹配到的值：constsearchKey=(val:string)=>{i
  • 【python爬虫入门教程13--selenium的自动点击 --小小案例分享】 重剑无锋1024 python爬虫selenium
    提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档《python爬虫入门教程12--selenium的安装与使用》selenium就是一个可以实现python自动化的模块，上次我们更新了如何安装以及它的语法。同时我也更新了如何用爬虫技术实现cookie免登录12306，再用selenium自动抢票。这个帖子主要是对selenium的一个语法讲解小案例，大家可以多运行试试。[免登录12
  • Linux xargs命令 fengyehongWorld Linuxlinux
    参考资料阮一峰-xargs命令教程xargsコマンド目录一.作用二.基本语法2.1-d指定分隔符2.2-p与-t选项2.3-L指定多少行作为一个命令行参数2.4-n指定将多少项作为参数2.5-I指定命令行参数占位符2.6--max-procs指定并行进程的数量三.小案例3.1文件删除3.2文件打包3.3文件移动3.4其他命令结合复杂用法一.作用⏹作用于不接收管道传参的命令，使其接受管道传来的标准输
  • 前端练习小项目——视觉冲击卡片 秋刀鱼不做梦 CSS前端学习htmlcsscss3vscode
    前言：前言：在学习完HTML和CSS之后，我们就可以开始做一些小项目了，本篇文章所讲的小项目为——视觉冲击卡片✨✨✨这里是秋刀鱼不做梦的BLOG✨✨✨想要了解更多内容可以访问我的主页秋刀鱼不做梦-CSDN博客先让我们看一下效果：那么我们如何去实现这样的小案例呢？在下文中我们对每一段重要的代码都进行了解释，读者可以根据注释对代码进行理解。1.HTML代码zjy这段HTML代码是一个基本的网页模板，展
  • canvas计时小案例 哈哈乐乐WXT
    前段时间看到某QQ群里有问这个效果怎么写，一时兴趣也研究了一下，写个小例子；效果基本实现了，代码也不是很完善，如实际操作还需更改；留着以后备用。效果图1.gifcss代码div{margin:0auto;margin-top:100px;background:#eee;width:500px;height:500px;text-align:center}canvas{margin:0auto;ma
  • 设计模式学习-简单的命令模式例子 一个不会码代码的小恐龙 设计模式学习命令模式unity
    上一章节介绍过了命令模式，这一篇文章就简单的做一个小案例来巩固学习搭建场景简单的搭建一个场景就行，随便准备一个物体放在场景中位置Reset一下即可。代码编写定义接口（或者抽象类）ICommand用来规范Command的行为。注意在命令模式中命令是桥接作用负责接受者和执行者之间的联调。所以一般会有很多的命令，每个命令都会有ICommand规范的方法同时也可以添加其他的方法。publicinterfa
  • 人定方能胜天 风追蓝天见海洋
    图片发自App书里讲到一个小案例很有趣，就是说，当供应18,000元和38,000元羽绒被的时候，38,000的高级羽绒被几乎无人问津。但是当推出了58,000的特级羽绒被之后，反而38,000的羽绒被销量一跃排到了第1位。这是因为，一开始只有两款产品的时候，顾客难以察觉38,000产品的价值，相比品质会更加关注价格便宜的产品。但如果有了三件产品，顾客就会进行挑选，在品质和价格之间作出选择，最后反
  • 云上运维案例分享 LinkSLA 云计算1024程序员节
    一、背景当下，越来越多的企业选择业务数据上云。不可否认数据上云后，增强了扩展的便利性，但是同时也提高了运维管理的难度。如何实现云上业务管理，是运维工程师们面临的新问题。LinkSLA智能运维管家，不仅提供私有云的运维管理，同时为公有云上业务系统提供了统一运维平台。方便IT运维工程师实时掌握公有云上系统的运行状况。二、案例下面我给大家分享一个云上运维监控的小案例：1、夜间重启在5月底，某三甲医院接入
  • django学习入门系列之第四点《javascript初了解》 铁匠匠匠 djangodjango学习javascript笔记开源python前端框架
    文章目录往期回顾javascript是一门编程语言，浏览器就是相当于这门语言的解释性DOM和BOM相当于这门语言内置的模块例如:Python的random，json模块JQuery可以理解为编程语言的第三方模块例如:openpyxl，requestsjavascript意义让程序实现一些动态的效果小案例Title.menus{width:200px;border:1pxsolidred;}.men
  • 情绪管理的修行之路第11篇 張濤
    情绪管理的修行之路（学习笔记第11篇）2021.1.16继续学习清华大学心理学系彭凯平教授的情绪管理课程，今天咱们探讨一下害羞和羞怯的情绪体验。【篇首语】：各位书友晚上好，在分享今天读后感之前先和大家分享一个小案例，相信对孩子是幼儿园和小学的家长朋友能有点提示。当我孩子进入初中阶段开始学习时，我请教过她一个问题，我是这样问的：你们班现在参加学校活动的主持人有没有新的面孔，她的回答让我陷入沉思！她说
  • 兰德系数（Rand Index） J@u1 日常心得（小笔记）图像分割聚类指标评价系数
    NOTE：1、一个小案例说明兰德系数是如何怎么计算的。很详细！2、关于兰德系数的讨论：https://stats.stackexchange.com/questions/89030/rand-index-calculation注意：+--------------------------------+--------------------------------------+|TP:|FN:||S
  • JavaScript设计模式：十、适配器模式 流水吾情 javascript设计模式适配器模式
    十、适配器模式一、概述适配器模式是设计模式行为型模式中的一种模式；定义：适配器用来解决两个已有接口之间不匹配的问题，它并不需要考虑接口是如何实现，也不用考虑将来该如何修改；适配器不需要修改已有接口，就可以使他们协同工作；1.最小案例vargoogleMap={show:function(){console.log('开始渲染谷歌地图');}};varbaiduMap={display:functi
  • Spring Security 可以同时对接多个用户表？ _江南一点雨
    @[toc]这个问题也是来自小伙伴的提问：image其实这个问题有好几位小伙伴问过我，但是这个需求比较冷门，我一直没写文章。其实只要看懂了松哥前面的文章，这个需求是可以做出来的。因为一个核心点就是ProviderManager，搞懂了这个，其他的就很容易了。今天松哥花一点时间，来和大家分析一下这个问题的核心，同时通过一个小小案例来演示一下如何同时连接多个数据源。1.原理1.1Authenticat
  • 详解Springboot整合Shiro加盐加散列实现登陆注册小案例 鱼小洲 技术杂谈shiromybatishashspringbootboot-shiro
    前言Springboot和Shiro的基本介绍我就不多说了，能看到这篇文章的相信也都会用。这篇文章主要是分享一下我在学习Shiro和Springboot的整合的小阶段。目前是复习，很感谢B站的up主——编程不良人的视频让我有了一个学习Shiro的基本方向。目前是实现了用户认证的功能。依赖整合的时候使用的是jsp，其实和thymeleaf一个道理，而且不涉及到作用域传值。我们需要导入的依赖有：mys
  • 详解Vue文件结构+实现一个简单案例 小馒头学python Vue3vue.js前端javascriptvue
    欢迎来到我的博客，你将找到有关如何使用技术解决问题的文章，也会找到某个技术的学习路线。无论你是何种职业，我都希望我的博客对你有所帮助。最后不要忘记订阅我的博客以获取最新文章，也欢迎在文章下方留下你的评论和反馈。我期待着与你分享知识、互相学习和建立一个积极的社区。谢谢你的光临，让我们一起踏上这个知识之旅！文章目录文件结构小案例总结文件结构├──public/#公共资源目录│├──index.html
  • 一个小例子，告诉你什么是衍生式设计 九哥BIMer Dynamo案例百解Dynamopython衍生式设计
    之前好多小伙伴想让我介绍介绍Dynamo与衍生式设计，奈何最近太忙了，实在没时间弄这些~趁着端午节，今天用一个小案例，先简单让大家对衍生式设计有个初步认识，之后有时间，我再多写几篇关于这方面的文章，好了，接下来进入正题：一、计算设计在了解衍生式设计之前，先来了解下什么是计算设计。计算设计不是任何一种你可以应用的算法或现成的过程。相反，我们将其描述为一种方法，设计师通过定义一系列指令、规则和关系，精
  • 鸿蒙小案例-你画我猜 幻凡ss harmonyosharmonyos华为
    鸿蒙小案例-你画我猜1.准备组件(组件布局)2.实现跟随鼠标画笔画出图案功能3.实现复制上面的画笔的图案功能4.其他小功能1.组件的准备画布的组件官方给的API是Canvas，需要传递一个参数CanvasRenderingContext2D直接搜索API使用官方案例privatesettings:RenderingContextSettings=newRenderingContextSetting
  • 守护成长感恩六月第一天 杨倩Grace
    ❤️感恩日记1．感恩经历了❤️10场小读者演讲沙龙❤️孩子们在台上的演讲从扭捏到敢于上台，这是一个大大的突破。‍♀️平日侃侃而谈的女孩，比赛台上也会脸红心跳加速；平时调皮捣蛋的男孩子们面对即兴演讲时，思路敏捷，沉着应对，生活小案例频频抖出，令到演讲生动风趣；❤️第一次站在这个演讲舞台的8岁女孩子，虽然紧张得不得了，还是积极准备，跃跃欲试，丰富的阅读底蕴，梦想当作家她更让家长和我们感悟到爱阅读的孩子
  • VueRouter：初识路由、声明式导航、重定向和别名、404设置、模式修改（HTML5 History 模式）、编程式导航、嵌套路由、导航守卫、路由元信息、导航高亮 小白小白从不日白 vuevue.js
    目录一、初识路由1.1什么是Vue-Router1.2什么单页面应用1.3Vue-Router的使用步骤1.4什么是router-link？1.5创建路由的几种方式1.6组件可以分为哪两类1.7路由综合小案例二、声明式导航2.1声明式导航基础使用2.2声明式导航跳转传值三、重定向和别名3.1重定向3.2给路由起别名四、路由404设置五、模式修改（History模式）六、编程式导航6.1编程式导航基
  • 新手入门------SpringBoot文件上传实现 布吉岛- 入门SpringBootspringbootjavaidea
    本次的内容是实现文件上传，小案例要达到的效果是在浏览器选择好文件，然后上传，最后返回结果（失败或成功），分为单文件和多文件上传。一.案例准备首先还是进行springboot项目的创建，这个就不进行演示了。本次需要添加的依赖是springweb和thymeleaf。如果已经有项目但是没有选择这两个依赖，可以点击pom.xml，在中手动添加如下依赖：org.springframework.bootsp
  • 用MiddleGenIDE工具生成hibernate的POJO（根据数据表生成POJO类） AdyZhang POJOeclipseHibernateMiddleGenIDE
    推荐:MiddlegenIDE插件,   是一个Eclipse   插件.     用它可以直接连接到数据库,   根据表按照一定的HIBERNATE规则作出BEAN和对应的XML ，用完后你可以手动删除它加载的JAR包和XML文件!     今天开始试着使用
  • .9.png Cb123456 android
      “点九”是andriod平台的应用软件开发里的一种特殊的图片形式，文件扩展名为：.9.png 　　智能手机中有自动横屏的功能,同一幅界面会在随着手机(或平板电脑)中的方向传感器的参数不同而改变显示的方向,在界面改变方向后,界面上的图形会因为长宽的变化而产生拉伸,造成图形的失真变形。 　　我们都知道android平台有多种不同的分辨率，很多控件的切图文件在被放大拉伸后，边
  • 算法的效率 天子之骄 算法效率复杂度最坏情况运行时间大O阶平均情况运行时间
    算法的效率 效率是速度和空间消耗的度量。集中考虑程序的速度，也称运行时间或执行时间，用复杂度的阶(O)这一标准来衡量。空间的消耗或需求也可以用大O表示，而且它总是小于或等于时间需求。   以下是我的学习笔记：   1.求值与霍纳法则，即为秦九韶公式。   2.测定运行时间的最可靠方法是计数对运行时间有贡献的基本操作的执行次数。运行时间与这个计数成正比。
  • java数据结构 何必如此 java数据结构
    Java 数据结构 Java工具包提供了强大的数据结构。在Java中的数据结构主要包括以下几种接口和类： 枚举（Enumeration） 位集合（BitSet） 向量（Vector） 栈（Stack） 字典（Dictionary） 哈希表（Hashtable） 属性（Properties） 以上这些类是传统遗留的，在Java2中引入了一种新的框架-集合框架(Collect
  • MybatisHelloWorld 3213213333332132
    //测试入口TestMyBatis package com.base.helloworld.test; import java.io.IOException; import org.apache.ibatis.io.Resources; import org.apache.ibatis.session.SqlSession; import org.apache.ibat
  • Java|urlrewrite|URL重写|多个参数 7454103 javaxmlWeb工作
     个人工作经验！ 如有不当之处，敬请指点 1.0  web -info 目录下建立     urlrewrite.xml  文件 类似如下： <?xml version="1.0" encoding="UTF-8" ?>   <!DOCTYPE u
  • 达梦数据库+ibatis darkranger sqlmysqlibatisSQL Server
    --插入数据方面 如果您需要数据库自增... 那么在插入的时候不需要指定自增列. 如果想自己指定ID列的值, 那么要设置 set identity_insert  数据库名.模式名.表名; ----然后插入数据; example: create table zhabei.test( id bigint identity(1,1) primary key, nam
  • XML 解析 四种方式 aijuans android
    XML现在已经成为一种通用的数据交换格式,平台的无关性使得很多场合都需要用到XML。本文将详细介绍用Java解析XML的四种方法。 XML现在已经成为一种通用的数据交换格式,它的平台无关性,语言无关性,系统无关性,给数据集成与交互带来了极大的方便。对于XML本身的语法知识与技术细节,需要阅读相关的技术文献,这里面包括的内容有DOM(Document Object
  • spring中配置文件占位符的使用 avords
    1.类 <?xml version="1.0" encoding="UTF-8"?><!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN//EN" "http://www.springframework.o
  • 前端工程化-公共模块的依赖和常用的工作流 bee1314 webpack
    题记： 一个人的项目，还有工程化的问题嘛？   我们在推进模块化和组件化的过程中，肯定会不断的沉淀出我们项目的模块和组件。对于这些沉淀出的模块和组件怎么管理？另外怎么依赖也是个问题？ 你真的想这样嘛？   var BreadCrumb = require(‘../../../../uikit/breadcrumb’); //真心ugly。  
  • 上司说「看你每天准时下班就知道你工作量不饱和」，该如何回应？ bijian1013 项目管理沟通IT职业规划
    问题：上司说「看你每天准时下班就知道你工作量不饱和」，如何回应         正常下班时间6点，只要是6点半前下班的，上司都认为没有加班。   Eno-Bea回答，注重感受，不一定是别人的         虽然我不知道你具体从事什么工作与职业，但是我大概猜测，你是从事一项不太容易出现阶段性成果的工作
  • TortoiseSVN，过滤文件 征客丶 SVN
    环境： TortoiseSVN 1.8 配置： 在文件夹空白处右键 选择  TortoiseSVN -> Settings 在 Global ignote pattern 中添加要过滤的文件： 多类型用英文空格分开 *name ： 过滤所有名称为 name 的文件或文件夹 *.name ： 过滤所有后缀为 name 的文件或文件夹 --------
  • 【Flume二】HDFS sink细说 bit1129 Flume
    1. Flume配置   a1.sources=r1 a1.channels=c1 a1.sinks=k1 ###Flume负责启动44444端口 a1.sources.r1.type=avro a1.sources.r1.bind=0.0.0.0 a1.sources.r1.port=44444 a1.sources.r1.chan
  • The Eight Myths of Erlang Performance bookjovi erlang
    erlang有一篇guide很有意思： http://www.erlang.org/doc/efficiency_guide 里面有个The Eight Myths of Erlang Performance： http://www.erlang.org/doc/efficiency_guide/myths.html   Myth: Funs are sl
  • java多线程网络传输文件(非同步)-2008-08-17 ljy325 java多线程socket
    利用 Socket 套接字进行面向连接通信的编程。客户端读取本地文件并发送；服务器接收文件并保存到本地文件系统中。 使用说明:请将TransferClient, TransferServer, TempFile三个类编译，他们的类包是FileServer. 客户端: 修改TransferClient: serPort, serIP, filePath, blockNum,的值来符合您机器的系
  • 读《研磨设计模式》-代码笔记-模板方法模式 bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.ResultSet;
  • 配置心得 chenyu19891124 配置
    时间就这样不知不觉的走过了一个春夏秋冬，转眼间来公司已经一年了，感觉时间过的很快，时间老人总是这样不停走，从来没停歇过。 作为一名新手的配置管理员，刚开始真的是对配置管理是一点不懂，就只听说咱们公司配置主要是负责升级，而具体该怎么做却一点都不了解。经过老员工的一点点讲解，慢慢的对配置有了初步了解，对自己所在的岗位也慢慢的了解。 做了一年的配置管理给自总结下： 1.改变 从一个以前对配置毫无
  • 对“带条件选择的并行汇聚路由问题”的再思考 comsci 算法工作软件测试嵌入式领域模型
    2008年上半年，我在设计并开发基于”JWFD流程系统“的商业化改进型引擎的时候，由于采用了新的嵌入式公式模块而导致出现“带条件选择的并行汇聚路由问题”(请参考2009-02-27博文)，当时对这个问题的解决办法是采用基于拓扑结构的处理思想，对汇聚点的实际前驱分支节点通过算法预测出来，然后进行处理，简单的说就是找到造成这个汇聚模型的分支起点，对这个起始分支节点实际走的路径数进行计算，然后把这个实际
  • Oracle 10g 的clusterware 32位 下载地址 daizj oracle
    Oracle 10g 的clusterware 32位 下载地址 http://pan.baidu.com/share/link?shareid=531580&uk=421021908 http://pan.baidu.com/share/link?shareid=137223&uk=321552738 http://pan.baidu.com/share/l
  • 非常好的介绍：Linux定时执行工具cron dongwei_6688 linux
    Linux经过十多年的发展，很多用户都很了解Linux了，这里介绍一下Linux下cron的理解，和大家讨论讨论。cron是一个Linux 定时执行工具，可以在无需人工干预的情况下运行作业，本文档不讲cron实现原理，主要讲一下Linux定时执行工具cron的具体使用及简单介绍。 新增调度任务推荐使用crontab -e命令添加自定义的任务（编辑的是/var/spool/cron下对应用户的cr
  • Yii assets目录生成及修改 dcj3sjt126com yii
    assets的作用是方便模块化，插件化的，一般来说出于安全原因不允许通过url访问protected下面的文件，但是我们又希望将module单独出来，所以需要使用发布，即将一个目录下的文件复制一份到assets下面方便通过url访问。 assets设置对应的方法位置 \framework\web\CAssetManager.php   assets配置方法 在m
  • mac工作软件推荐 dcj3sjt126com mac
    mac上的Terminal + bash ＋ screen组合现在已经非常好用了，但是还是经不起iterm＋zsh＋tmux的冲击。在同事的强烈推荐下，趁着升级mac系统的机会，顺便也切换到iterm＋zsh＋tmux的环境下了。 我为什么要要iterm2 切换过来也是脑袋一热的冲动，我也调查过一些资料，看了下iterm的一些优点： * 兼容性好，远程服务器 vi 什么的低版本能很好兼
  • Memcached(三)、封装Memcached和Ehcache frank1234 memcachedehcachespring ioc
    本文对Ehcache和Memcached进行了简单的封装，这样对于客户端程序无需了解ehcache和memcached的差异，仅需要配置缓存的Provider类就可以在二者之间进行切换，Provider实现类通过Spring IoC注入。 cache.xml <?xml version="1.0" encoding="UTF-8"?>
  • Remove Duplicates from Sorted List II hcx2013 remove
    Given a sorted linked list, delete all nodes that have duplicate numbers, leaving only distinct numbers from the original list. For example,Given 1->2->3->3->4->4->5,
  • Spring4新特性——注解、脚本、任务、MVC等其他特性改进 jinnianshilongnian spring4
    Spring4新特性——泛型限定式依赖注入 Spring4新特性——核心容器的其他改进 Spring4新特性——Web开发的增强 Spring4新特性——集成Bean Validation 1.1(JSR-349)到SpringMVC  Spring4新特性——Groovy Bean定义DSL Spring4新特性——更好的Java泛型操作API  Spring4新
  • MySQL安装文档 liyong0802 mysql
      工作中用到的MySQL可能安装在两种操作系统中，即Windows系统和Linux系统。以Linux系统中情况居多。   安装在Windows系统时与其它Windows应用程序相同按照安装向导一直下一步就即，这里就不具体介绍，本文档只介绍Linux系统下MySQL的安装步骤。   Linux系统下安装MySQL分为三种：RPM包安装、二进制包安装和源码包安装。二
  • 使用VS2010构建HotSpot工程 p2p2500 HotSpotOpenJDKVS2010
    1. 下载OpenJDK7的源码：      http://download.java.net/openjdk/jdk7      http://download.java.net/openjdk/      2. 环境配置     ▶
  • Oracle实用功能之分组后列合并 seandeng888 oracle分组实用功能合并
    1       实例解析 由于业务需求需要对表中的数据进行分组后进行合并的处理，鉴于Oracle10g没有现成的函数实现该功能，且该功能如若用JAVA代码实现会比较复杂，因此，特将SQL语言的实现方式分享出来，希望对大家有所帮助。如下： 表test 数据如下： ID,SUBJECTCODE,DIMCODE,VALUE 1&nbs
  • Java定时任务注解方式实现 tuoni javaspringjvmxmljni
    Spring 注解的定时任务，有如下两种方式： 第一种： <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans"  xmlns:xsi="http
  • 11大Java开源中文分词器的使用方法和分词效果对比 yangshangchuan word分词器ansj分词器Stanford分词器FudanNLP分词器HanLP分词器
    本文的目标有两个： 1、学会使用11大Java开源中文分词器 2、对比分析11大Java开源中文分词器的分词效果 本文给出了11大Java开源中文分词的使用方法以及分词结果对比代码，至于效果哪个好，那要用的人结合自己的应用场景自己来判断。 11大Java开源中文分词器，不同的分词器有不同的用法，定义的接口也不一样，我们先定义一个统一的接口： /** * 获取文本的所有分词结果, 对比
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他