a_fafafa
a_fafafa

JavaScript模态框显示、隐藏、拖拽效果的实现

实现效果
1、点击登录按钮，模态框显示
2、点击关闭按钮，模态框隐藏
3、在指定可拖拽位置按下鼠标，模态框可跟随鼠标移动
4、松开鼠标，模态框停留在原地

DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>title>
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
			}
			a{
				text-decoration: none;
				color:#000;
			}
			.login-header{
				text-align: center;
				font-size: 25px;
				width: 400px;
				height: 50px;
				line-height: 50px;
				margin: 10px auto;
				border: #ccc 2px solid;
				border-radius: 15px;
				background-color:#ebebeb;
			}
			.login{
				display: none;
				width: 512px;
				height: 280px;
				position: fixed;
				border: #ebebeb solid 1px;
				border-radius: 10px;
				left: 50%;
				top: 50%;
				background-color: #fff;
				box-shadow: 0px 0px 20px #ddd;
				z-index: 9999;
				transform: translate(-50%,-50%);
			}
			.login-title{
				text-align: center;
				margin: 20px auto;
				width: 100%;
				height: 40px;
				font-size: 20px;
				font-weight: 600;
				position: relative;
				cursor: move;
			}
			.login-input-content{
				margin-top: 20px;
			}
			.login-button{
				position: absolute;
				left:25%;
				bottom:0;
				width: 50%;
				height: 40px;
				margin: 30px auto ;
				line-height: 40px;
				font-size: 14px;
				border: #ccc 2px solid;
				text-align: center;
				border-radius: 5px;
			}
			.login-bg{
				display: none;
				text-align: center;
				width: 100%;
				height: 100%;
				position: fixed;
				top: 0;
				left: 0;
				background-color: rgba(0,0,0,.1);
			}
			.login-button a{
				display: block;
			}
			.login-input input.list-input{
				margin-bottom: 20px;
				float: left;
				line-height: 35px;
				width: 350px;
				height: 35px;
				border: #ccc 1px solid;
				text-indent: 5px;
				border-radius: 5px;
			}
			.login-input label{
				float: left;
				width: 90px;
				padding-right: 10px;
				text-align: right;
				line-height: 35px;
				height: 35px;
				font-size: 16px;
			}
			.login-title span{
				position: absolute;
				font-size: 12px;
				right: -20px;
				top: -40px;
				background-color: #fff;
				border: #ebebeb solid 1px;
				width: 40px;
				height: 40px;
				text-align: center;
				line-height: 40px;
				border-radius: 20px;
				font-weight: 400;
			}
		style>
	head>
	<body>
		<div class="login-header"><a id="link" href="javascript:;">点击，弹出登录框a>div>
		<div class="login" id="login">
			<div id="title" class="login-title">
				登录会员<span><a href="javascript:void(0);" id="closeBtn" class="close-login">关闭a>span>
			div>
			<div class="login-input">
				<div class="login-input-content">
					<label>用户名：label>
					<input type="text" placeholder="请输入用户名" name="info[username]" id="username" value="" class="list-input"/>
				div>
				<div class="login-input-content">
					<label>密码：label>
					<input type="password" placeholder="请输入登录密码" name="info[password]" id="password" value="" class="list-input"/>
				div>
			div>
			
			<div class="login-button" id="loginBtn">
				<a href="javascript:void(0);" id="login-button-submit" class="login-button-submit">登录会员a>
			div>
		div>
		<div id="bg" class="login-bg">div>
		<script type="text/javascript">
		// 1、获取元素
			var login = document.querySelector('.login');
			var mask = document.querySelector('.login-bg');
			var link = document.querySelector('#link');
			var closeBtn = document.querySelector('#closeBtn');
			var title = document.querySelector('#title');
		// 2、点击弹出这个链接 link 让mask 和login 显示出来
			link.addEventListener('click',function(){
				mask.style.display = 'block';
				login.style.display = 'block';
			})
		// 3、点击closeBtn 隐藏login 和mask
			closeBtn.addEventListener('click',function(){
				mask.style.display = 'none';
				login.style.display = 'none';
			})
		// 4、开始拖拽 
		// (1)当鼠标按下，就获得鼠标在盒子内在坐标
			title.addEventListener('mousedown',function(e){
				var x = e.pageX - login.offsetLeft;
				var y = e.pageY - login.offsetTop;
		// (2)鼠标移动的时候，把鼠标在页面中的坐标减去鼠标在盒子中的坐标，就是模态框left和top的值
				document.addEventListener('mousemove',move);
				function move(e){
					login.style.left =  e.pageX - x + 'px';
					login.style.top =  e.pageY - y + 'px';
				}
		// (3)鼠标弹起，就让鼠标事件移除
				document.addEventListener('mouseup',function(){
					document.removeEventListener('mousemove',move);
				})
			})
		script>
	body>
html>

你可能感兴趣的:(html,css,js)

  • Cuppa CMS任意文件读取漏洞（CVE-2022-25401） 风中追风-fzzf #文件读取安全web安全
    一、漏洞概述CuppaCMSv1.0中文件管理器的复制功能允许将任何文件复制到当前目录，从而授予攻击者对任意文件得读取权限，/templates/default/html/windows/right.php文件存在任意文件读取漏洞。二、影响范围v1.0三、访问页面四、漏洞复现1、访问接口POST接口/templates/default/html/windows/right.phpPOST/temp
  • 深入剖析 Java 反序列化：FASTjson 漏洞与 Shiro 漏洞 阿贾克斯的黎明 网络安全phpweb安全开发语言
    目录深入剖析Java反序列化：FASTjson漏洞与Shiro漏洞引言Java反序列化原理示例代码FASTjson漏洞分析漏洞成因示例代码防护措施Shiro漏洞分析漏洞成因示例代码（模拟攻击场景）防护措施总结引言在Java应用开发中，反序列化是一项重要的技术，但同时也隐藏着巨大的安全风险。FASTjson和Shiro作为Java开发中常用的工具和框架，其反序列化漏洞曾引发了广泛关注。本文将深入探讨
  • 前端开发中的常见问题与疑惑：解析与应对策略 lina_mua javascriptvue.jshtml前端es6
    1.引言1.1前端开发的复杂性前端开发涉及HTML、CSS、JavaScript等多种技术，同时还需要考虑性能优化、跨浏览器兼容性、用户体验等问题。随着前端技术的快速发展，开发者面临的挑战也越来越多。1.2本文的目标本文旨在总结前端开发中常见的问题与疑惑，并提供相应的解决方案和应对策略，帮助开发者更好地应对挑战。2.HTML/CSS常见问题2.1布局问题：如何实现复杂的页面布局？问题描述：实现复杂
  • 探索表单设计新境界：React JSON Schema Form 编辑器 包椒浩Leith
    探索表单设计新境界：ReactJSONSchemaForm编辑器react-json-schema-form-builderVisualeditorforformsbasedonjsonschema,builtinReactJS项目地址:https://gitcode.com/gh_mirrors/re/react-json-schema-form-builder在当今快速迭代的软件开发领域，灵活
  • Geo3D城市引擎大规模建筑植被渲染 苹果园dog WebGLGIS3d
    import*asGeo3Dfrom"../src";importInitHelperfrom"./InitHelper";//3D场景初始化constsceneControl=InitHelper.init3D();constcontainer=document.querySelector("#map")asHTMLElement;container&&sceneControl.render(c
  • Day5 --- Flask-RESTful请求响应与SQLAlchemy基础 laufing 问题flaskrestfulpython
    文章目录昨日回顾今日内容1.请求解析1.1RequestParser处理请求1.2参数详解1.3处理请求案例2.返回响应2.1序列化数据:2.2返回JSON格式3.ORM与Flask-SQLAlchemy3.1ORM介绍ORM框架3.2Flask-SQLAlchemy扩展3.3定义模型类3.4数据库迁移操作4.数据增删改查4.1新增数据4.2简单查询4.3更新数据4.4删除数据5.数据操作案例昨日
  • 点击修改按钮图片显示有问题 小丁学Java 产品资质管理系统vue
    问题可能出在表单数据的初始化上。在ave-form.vue中，我们需要处理一下从后端返回的图片数据，因为它们可能是JSON字符串格式。vue:src/views/tools/fake-strategy/components/ave-form.vue//...existingcode...@Watch('value')watchValue(v:any){this.$nextTick(()=>{thi
  • 【Python】7天-python实现缓存-day01 qq_40375355 Python-7天小项目pythonpython缓存开发语言
    使用Python实现类似redis的缓存，原文是使用go实现的，本文使用python实现，用来比较两者的区别，方便从python转go的开发者比较二者的不同。PS：原文链接是：https://geektutu.com/post/geecache-day1.htmlPS:预计在完成前还会对本文多次修改仅作参考PS:测试代码也会在后续补充一、LRU和LRU-K原文使用的是LRU算法，这里改成LRU-K
  • Django模板系统深入 jay丿 djangosqlite数据库
    Django模板系统深入模板继承和重用Block标签在Django模板中，{%block%}标签允许你定义一个“块”，这个块可以在子模板中被重写或填充。{%blocktitle%}MySite{%endblock%}Welcometomysite{%blockcontent%}{%endblock%}{%extends"base.html"%}{%blocktitle%}MyChildPage{%
  • MRtrix3安装报错2则：Checking for Qt: ERROR: error linking Qt application! 皎皎如月明 linux运维服务器
    服了，mrtrix3官网现在只推荐了conda安装这种方法，但是conda安装我一直报错，报错代码如下：Solvingenvironment:failedwithinitialfrozensolve.Retryingwithflexiblesolve.Collectingpackagemetadata(repodata.json):donePackagesNotFoundError:Thefoll
  • drupal如何查看已有网页的源码 dev.null 前端前端
    在Drupal中查看已有网页的源码（HTML源代码），你可以通过以下几种方法：方法1：使用浏览器的开发者工具打开网页：访问你想查看源代码的页面。右键点击页面：在页面的任意空白处，右键点击，然后选择查看页面源代码（ViewPageSource）或者检查（Inspect）选项（具体名称取决于浏览器）。查看源代码：如果选择了“查看页面源代码”，浏览器将会显示该页面的HTML源码。如果选择了“检查”，会打
  • 【华为OD-E卷 - 120 分割数组的最大差值 100分（python、java、c++、js、c）】 CodeClimb 算法题华为od（A+B+C+D+E卷）收录分享华为odpythonjavac++javascript
    【华为OD-E卷-分割数组的最大差值100分（python、java、c++、js、c）】题目给定一个由若干整数组成的数组nums，可以在数组内的任意位置进行分割，将该数组分割成两个非空子数组（即左数组和右数组），分别对子数组求和得到两个值，计算这两个值的差值，请输出所有分割方案中，差值最大的值输入描述第一行输入数组中元素个数n，10?prefixSum[i-1]:0);}longtotalSum
  • Python爬虫实战（一）：翻页爬取数据存入SqlServer_python爬虫翻页 2401_84563438 程序员python爬虫sqlserver
    print(str(e))#关闭游标，断开数据库cursor.close()db.close()#实现主要逻辑defrun(self):fortype_numinrange(1,46):#1.拼接网页获取每个类别的页数pageurl=self.baseurl%(1,type_num)html_str=self.parse_url(url)page=self.get_page_num(html_st
  • Vue的单元测试和端到端测试：确保组件可靠性与应用完整性 哎 你看 vuevue.js单元测试前端
    引言在软件开发过程中，测试是保证代码质量和应用稳定性的关键环节。Vue.js作为流行的前端框架，提供了一套完善的测试工具和生态系统，支持开发者进行单元测试和端到端测试。本文将深入探讨如何为Vue组件编写单元测试，并讨论如何使用Cypress等工具进行端到端测试。单元测试1.单元测试的概念单元测试是针对程序中最小的可测试单元进行检查和验证的过程，通常关注函数或方法级别的测试。2.Vue组件的单元测试
  • 1-5.WPS JS宏对象的属性、方法、集合---学习笔记 爱上妖精的尾巴 WPSJS宏编程教程学习笔记wps笔记jsjavascript开发语言学习
    每个对象都有属性与方法。比如人就是一个对象，而人的手或脚就可以看做是人对象下的子对象。人的身高、体重就是属性。而人在吃、喝、拉、撒、睡就是方法(动作)。而多个对象就可以形成集合，比如一屋子人。在JS中，也是万物皆对象。比如JS中的字符串、数组、函数等都是对象。这些对象都有自己的属性与方法，后面在对应的章节中都有讲解。而在WPS表格，也有很多对象，比如WPS表格程序就是最大的对象，再比如WPS的工作
  • Vue.js 组件化开发：从入门到进阶 小李学软件 vue学习前端框架vue.js前端javascript前端框架
    Vue.js组件化开发：从入门到进阶大家好，今天我们来聊一聊Vue.js的“组件化开发”。目前Vue开发已经相对成熟了，相信很多朋友对组件化开发并不陌生。如果你对组件化开发已经非常熟悉，看到我的文章，欢迎点个支持一下。如果你是刚入门，我强烈建议学习一下哦。如果你想巩固Vue组件化的知识，非常推荐来学习。一、什么是组件化开发？在进入正题之前，想问大家一个问题：你有没有拼过乐高？如果有的话，你就会知道
  • Kali Linux信息收集工具 dechen6073
    http://www.freebuf.com/column/150118.html可能大部分渗透测试者都想成为网络空间的007，而我个人的目标却是成为Q先生！看过007系列电影的朋友，应该都还记得那个戏份不多但一直都在的Q先生（由于年级太长目前已经退休）。他为007发明了众多神奇的武器，并且总能在关键时刻挽救大英雄于危难之间。但是与Q先生相比我很惭愧。因为到目前为止我还没有发明出什么可以与他相比的
  • Vue.js组件开发：从基础到进阶 码上飞扬 vue.js
    在现代前端开发中，Vue.js因其简洁、灵活和易上手的特点，成为了众多开发者首选的框架之一。组件化是Vue.js的核心思想之一，它让我们能够更高效、模块化地开发应用。在本文中，我们将从Vue.js的组件开发的基础知识开始，逐步探索如何通过Vue.js进行高效的组件化开发。一、Vue.js组件的基础Vue.js中的组件可以理解为一个具有特定功能的代码块，它通常包含视图（HTML）、样式（CSS）和逻
  • 比较RPC和RESTful API的优缺点 事业运财运爆棚 android
    RPC和RESTfulAPI是两种不同的远程调用方式，它们各自具有不同的优缺点。RPC的优点包括：高效：RPC使用自定义的通信协议，可以减少报文传输量，提高传输效率。灵活：RPC支持多种语言，不同的编程语言可以方便地调用远程接口。通用：RPC可以基于XML、JSON等标准化的数据格式进行通信，使得不同语言之间可以正确地传递数据。RPC的缺点包括：实现复杂：RPC需要实现编码、序列化、网络传输等功能
  • HarmonyOS NEXT 原生应用/元服务调试概述 李洋-蛟龙腾飞公司 华为
    一、概述DevEcoStudio提供了丰富的HarmonyOS应用/元服务调试能力，支持JS、ArkTS、C/C单语言调试和ArkTS/JS+C/C跨语言调试能力，并且支持三方库源码调试，帮助开发者更方便、高效地调试应用/元服务。HarmonyOS应用/元服务调试支持使用真机设备、模拟器、预览器调试。接下来以使用真机设备为例进行说明，详细的调试流程如下图所示：1.配置签名信息：使用真机设备进行调试
  • redis中的bigkey及读取优化 w_t_y_y #java操作redisredis数据库缓存
    一、bigKey介绍1、简介在Redis中，BigKey（大键）指的是占用大量内存的单个键。通常，Redis是一个高性能的内存数据库，但是当某些键变得非常大时，会带来性能上的影响。例如，大量的内存消耗、长时间的操作延迟，甚至可能导致Redis停止响应或崩溃。通俗的来说，指的是value值大，而不是key值大。2、case大字符串（String）：单个字符串值过大，例如存储非常大的JSON或XML数
  • 现代前端框架渲染机制深度解析：虚拟DOM到编译时优化 桂月二二 前端框架
    引言：前端框架的性能进化论TikTokWeb将React18迁移至Vue3后，点击响应延迟降低42%，内存占用减少35%。Shopify采用Svelte重构核心交互模块，首帧渲染速度提升580%。Discord在Next.js14中启用ReactServerComponents后，服务端数据吞吐量增加240%，客户端Bundle体积减少54%。一、主流框架技术架构差异1.1三大范式运行机制对比维度
  • 常用的HTML标签及属性 微剑 python前端开发htmlcss
    前端开发常用的HTML标签和属性较为丰富，以下是一些常用的HTML标签和属性：1.标题标签：h1、h2、h3、h4、h5、h6；属性：id、class、style2.段落标签：p；属性：id、class、style3.图像标签：img；属性：src、alt、title、width、height、border、align4.超链接标签：a；属性：href、target、title、id、class、
  • freemarker解析html标签,【转】Freemarker输出$和html标签等特殊符号 weixin_39970689
    原文：http://blog.csdn.net/achilles12345/article/details/41820507场景：程序员都不喜欢看文档，而更喜欢抄例子。所以，我们把平台组的组件都做成例子供别人参考。我们前端展示层使用的是freemarker，所以遇到这个问题，比如我们要让前端显示freemarker自己的源码时就有问题了(因为我们例子程序的页面也是使用freemarker)。遇到的
  • java 解析html标签_Java解析HTML标签 理性教会 java解析html标签
    #基于状态机思想实现解析HTMLTAG，后续有时间的话尝试写一个JSON解析工具。importjava.util.HashMap;importjava.util.Map;publicclassTagParser{privateIntegerindex=0;privatechar[]tagChar;privateintposition=0;/*解析符号*/privatecharsymbol='"';
  • Vue.js 深入解析：从基础到进阶 sleepwalking450 vue.js前端javascript
    Vue.js是一个渐进式JavaScript框架，专注于构建用户界面，尤其是单页面应用（SPA）。它的设计理念强调“渐进式框架”，即你可以从最基本的功能开始，逐步引入更多的功能以应对复杂的应用需求。Vue.js既可以作为一个简单的UI渲染引擎，也可以通过VueRouter和Vuex扩展为强大的全栈开发工具。本篇文章将对Vue.js的核心特性进行更加细致的分析，帮助你从基本的入门知识到更加复杂的高级
  • Vue.js 入门指南：从基础到实战 阿绵 前端vue.js前端javascript
    Vue.js是一款流行的渐进式JavaScript框架，广泛用于构建交互式Web界面。它具有简单易学、轻量级、高性能的特点，适合前端新手入门。本文将从Vue的基本概念入手，详细介绍Vue的生命周期及常见用法，帮助你快速上手Vue开发官网：https://cn.vuejs.org/1.Vue.js介绍1.1Vue的特点易学易用：Vue采用直观的模板语法，降低了学习成本响应式数据绑定：使用双向绑定(v
  • 过滤Html标签 风野烂漫 技术过滤Html标签
    有时候在iOS开发中，有可能遇到需要把Html的标签过滤成字符串过滤标签成字符串+(NSString*)filterHtmlTag:(NSString*)originHtmlStr{if(!originHtmlStr||[originHtmlStrisKindOfClass:[NSNullclass]]){return@“没有内容";}NSString*result=nil;NSRangearro
  • 深入浅出 Vue.js：从基础到进阶的全面总结 多年以后_ vue.js前端javascript
    深入浅出Vue.js：从基础到进阶的全面总结Vue.js是一个用于构建用户界面的渐进式框架。它不仅易于上手，还能通过其强大的生态系统支持复杂的应用开发。本文将从基础到进阶，全面总结Vue.js的核心概念、常用技术和最佳实践，并提供代码示例以便更好地理解。目录Vue.js基础Vue实例模板语法计算属性和侦听器组件系统组件基础父子组件通信插槽VueRouter路由基础动态路由匹配嵌套路由Vuex状态管
  • python os.path模块常用方法详解 清平乐的技术博客 Python高级应用
    pythonos.path模块常用方法详解os.path模块主要用于文件的属性获取，在编程中经常用到，以下是该模块的几种常用方法。更多的方法可以去查看官方文档：http://docs.python.org/library/os.path.html1.os.path.abspath(path)返回path规范化的绝对路径。os.path.abspath(‘test.csv’)‘C:\Python25
  • [星球大战]阿纳金的背叛 comsci
          本来杰迪圣殿的长老是不同意让阿纳金接受训练的.........     但是由于政治原因,长老会妥协了...这给邪恶的力量带来了机会     所以......现代的地球联邦接受了这个教训...绝对不让某些年轻人进入学院    
  • 看懂它，你就可以任性的玩耍了！ aijuans JavaScript
              javascript作为前端开发的标配技能，如果不掌握好它的三大特点：1.原型 2.作用域 3. 闭包 ,又怎么可以说你学好了这门语言呢？如果标配的技能都没有撑握好，怎么可以任性的玩耍呢？怎么验证自己学好了以上三个基本点呢，我找到一段不错的代码，稍加改动，如果能够读懂它，那么你就可以任性了。 function jClass(b
  • Java常用工具包 Jodd Kai_Ge javajodd
    Jodd 是一个开源的 Java 工具集， 包含一些实用的工具类和小型框架。简单，却很强大！ 写道 Jodd = Tools + IoC + MVC + DB + AOP + TX + JSON + HTML < 1.5 Mb Jodd 被分成众多模块，按需选择，其中 工具类模块有： jodd-core    &nb
  • SpringMvc下载 120153216 springMVC
    @RequestMapping(value = WebUrlConstant.DOWNLOAD) public void download(HttpServletRequest request,HttpServletResponse response,String fileName) { OutputStream os = null; InputStream is = null;
  • Python 标准异常总结 2002wmj python
    Python标准异常总结 AssertionError 断言语句（assert）失败 AttributeError 尝试访问未知的对象属性 EOFError 用户输入文件末尾标志EOF（Ctrl+d） FloatingPointError 浮点计算错误 GeneratorExit generator.close()方法被调用的时候 ImportError 导入模块失
  • SQL函数返回临时表结构的数据用于查询 357029540 SQL Server
    这两天在做一个查询的SQL，这个SQL的一个条件是通过游标实现另外两张表查询出一个多条数据，这些数据都是INT类型，然后用IN条件进行查询，并且查询这两张表需要通过外部传入参数才能查询出所需数据，于是想到了用SQL函数返回值，并且也这样做了，由于是返回多条数据，所以把查询出来的INT类型值都拼接为了字符串，这时就遇到问题了，在查询SQL中因为条件是INT值，SQL函数的CAST和CONVERST都
  • java 时间格式化 | 比较大小| 时区 个人笔记 7454103 javaeclipsetomcatcMyEclipse
    个人总结！ 不当之处多多包含！ 引用 1.0 如何设置 tomcat 的时区：          位置：(catalina.bat---JAVA_OPTS  下面加上)          set JAVA_OPT
  • 时间获取Clander的用法 adminjun Clander时间
    /**    * 得到几天前的时间    * @param d    * @param day    * @return    */   public static Date getDateBefore(Date d,int day){    Calend
  • JVM初探与设置 aijuans java
    JVM是Java Virtual Machine（Java虚拟机）的缩写，JVM是一种用于计算设备的规范，它是一个虚构出来的计算机，是通过在实际的计算机上仿真模拟各种计算机功能来实现的。Java虚拟机包括一套字节码指令集、一组寄存器、一个栈、一个垃圾回收堆和一个存储方法域。 JVM屏蔽了与具体操作系统平台相关的信息，使Java程序只需生成在Java虚拟机上运行的目标代码（字节码）,就可以在多种平台
  • SQL中ON和WHERE的区别 avords
    SQL中ON和WHERE的区别   数据库在通过连接两张或多张表来返回记录时，都会生成一张中间的临时表，然后再将这张临时表返回给用户。   www.2cto.com   在使用left jion时，on和where条件的区别如下：  1、 on条件是在生成临时表时使用的条件，它不管on中的条件是否为真，都会返回左边表中的记录。 
  • 说说自信 houxinyou 工作生活
    自信的来源分为两种,一种是源于实力,一种源于头脑.实力是一个综合的评定,有自身的能力,能利用的资源等.比如我想去月亮上,要身体素质过硬,还要有飞船等等一系列的东西.这些都属于实力的一部分.而头脑不同,只要你头脑够简单就可以了!同样要上月亮上,你想,我一跳,1米,我多跳几下,跳个几年,应该就到了!什么?你说我会往下掉?你笨呀你!找个东西踩一下不就行了吗?     无论工作还
  • WEBLOGIC事务超时设置 bijian1013 weblogicjta事务超时
            系统中统计数据，由于调用统计过程，执行时间超过了weblogic设置的时间，提示如下错误： 统计数据出错! 原因：The transaction is no longer active - status: 'Rolling Back. [Reason=weblogic.transaction.internal
  • 两年已过去，再看该如何快速融入新团队 bingyingao java互联网融入架构新团队
    偶得的空闲，翻到了两年前的帖子 该如何快速融入一个新团队，有所感触，就记下来，为下一个两年后的今天做参考。     时隔两年半之后的今天，再来看当初的这个博客，别有一番滋味。而我已经于今年三月份离开了当初所在的团队，加入另外的一个项目组，2011年的这篇博客之后的时光，我很好的融入了那个团队，而直到现在和同事们关系都特别好。大家在短短一年半的时间离一起经历了一
  • 【Spark七十七】Spark分析Nginx和Apache的access.log bit1129 apache
    Spark分析Nginx和Apache的access.log，第一个问题是要对Nginx和Apache的access.log文件进行按行解析，按行解析就的方法是正则表达式：   Nginx的access.log解析正则表达式   val PATTERN = """([^ ]*) ([^ ]*) ([^ ]*) (\\[.*\\]) (\&q
  • Erlang patch bookjovi erlang
    Totally five patchs committed to erlang otp, just small patchs. IMO, erlang really is a interesting programming language, I really like its concurrency feature. but the functional programming style
  • log4j日志路径中加入日期 bro_feng javalog4j
    要用log4j使用记录日志，日志路径有每日的日期，文件大小5M新增文件。 实现方式 log4j: <appender name="serviceLog" class="org.apache.log4j.RollingFileAppender"> <param name="Encoding" v
  • 读《研磨设计模式》-代码笔记-桥接模式 bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ /** * 个人觉得关于桥接模式的例子，蜡笔和毛笔这个例子是最贴切的：http://www.cnblogs.com/zhenyulu/articles/67016.html * 笔和颜色是可分离的，蜡笔把两者耦合在一起了：一支蜡笔只有一种
  • windows7下SVN和Eclipse插件安装 chenyu19891124 eclipse插件
    今天花了一天时间弄SVN和Eclipse插件的安装，今天弄好了。svn插件和Eclipse整合有两种方式，一种是直接下载插件包，二种是通过Eclipse在线更新。由于之前Eclipse版本和svn插件版本有差别，始终是没装上。最后在网上找到了适合的版本。所用的环境系统：windows7JDK：1.7svn插件包版本：1.8.16Eclipse：3.7.2工具下载地址：Eclipse下在地址：htt
  • [转帖]工作流引擎设计思路 comsci 设计模式工作应用服务器workflow企业应用
    作为国内的同行，我非常希望在流程设计方面和大家交流，刚发现篇好文(那么好的文章，现在才发现，可惜)，关于流程设计的一些原理，个人觉得本文站得高，看得远，比俺的文章有深度，转载如下 ================================================================================= 自开博以来不断有朋友来探讨工作流引擎该如何
  • Linux 查看内存，CPU及硬盘大小的方法 daizj linuxcpu内存硬盘大小
    一、查看CPU信息的命令 [root@R4 ~]# cat /proc/cpuinfo |grep "model name" && cat /proc/cpuinfo |grep "physical id" model name : Intel(R) Xeon(R) CPU X5450 @ 3.00GHz model name :
  • linux 踢出在线用户 dongwei_6688 linux
    两个步骤： 1.用w命令找到要踢出的用户，比如下面：   [root@localhost ~]# w 18:16:55 up 39 days, 8:27, 3 users, load average: 0.03, 0.03, 0.00 USER TTY FROM LOGIN@ IDLE JCPU PCPU WHAT
  • 放手吧,就像不曾拥有过一样 dcj3sjt126com
    内容提要： 静悠悠编著的《放手吧就像不曾拥有过一样》集结“全球华语世界最舒缓心灵”的精华故事，触碰生命最深层次的感动，献给全世界亿万读者。《放手吧就像不曾拥有过一样》的作者衷心地祝愿每一位读者都给自己一个重新出发的理由，将那些令你痛苦的、扛起的、背负的，一并都放下吧！把憔悴的面容换做一种清淡的微笑，把沉重的步伐调节成春天五线谱上的音符，让自己踏着轻快的节奏，在人生的海面上悠然漂荡，享受宁静与
  • php二进制安全的含义 dcj3sjt126com PHP
    PHP里，有string的概念。 string里，每个字符的大小为byte（与PHP相比，Java的每个字符为Character，是UTF8字符，C语言的每个字符可以在编译时选择）。 byte里，有ASCII代码的字符，例如ABC，123，abc，也有一些特殊字符，例如回车，退格之类的。 特殊字符很多是不能显示的。或者说，他们的显示方式没有标准，例如编码65到哪儿都是字母A，编码97到哪儿都是字符
  • Linux下禁用T440s，X240的一体化触摸板(touchpad) gashero linuxThinkPad触摸板
    自打1月买了Thinkpad T440s就一直很火大，其中最让人恼火的莫过于触摸板。   Thinkpad的经典就包括用了小红点(TrackPoint)。但是小红点只能定位，还是需要鼠标的左右键的。但是自打T440s等开始启用了一体化触摸板，不再有实体的按键了。问题是要是好用也行。   实际使用中，触摸板一堆问题，比如定位有抖动，以及按键时会有飘逸。这就导致了单击经常就
  • graph_dfs hcx2013 Graph
    package edu.xidian.graph; class MyStack { private final int SIZE = 20; private int[] st; private int top; public MyStack() { st = new int[SIZE]; top = -1; } public void push(i
  • Spring4.1新特性——Spring核心部分及其他 jinnianshilongnian spring 4.1
    目录 Spring4.1新特性——综述 Spring4.1新特性——Spring核心部分及其他 Spring4.1新特性——Spring缓存框架增强 Spring4.1新特性——异步调用和事件机制的异常处理 Spring4.1新特性——数据库集成测试脚本初始化 Spring4.1新特性——Spring MVC增强 Spring4.1新特性——页面自动化测试框架Spring MVC T
  • 配置HiveServer2的安全策略之自定义用户名密码验证 liyonghui160com
        具体从网上看   http://doc.mapr.com/display/MapR/Using+HiveServer2#UsingHiveServer2-ConfiguringCustomAuthentication   LDAP Authentication using OpenLDAP Setting
  • 一位30多的程序员生涯经验总结 pda158 编程工作生活咨询
    1.客户在接触到产品之后，才会真正明白自己的需求。 　　这是我在我的第一份工作上面学来的。只有当我们给客户展示产品的时候，他们才会意识到哪些是必须的。给出一个功能性原型设计远远比一张长长的文字表格要好。 2.只要有充足的时间，所有安全防御系统都将失败。 　　安全防御现如今是全世界都在关注的大课题、大挑战。我们必须时时刻刻积极完善它，因为黑客只要有一次成功，就可以彻底打败你。   3.
  • 分布式web服务架构的演变 自由的奴隶 linuxWeb应用服务器互联网
    最开始，由于某些想法，于是在互联网上搭建了一个网站，这个时候甚至有可能主机都是租借的，但由于这篇文章我们只关注架构的演变历程，因此就假设这个时候已经是托管了一台主机，并且有一定的带宽了，这个时候由于网站具备了一定的特色，吸引了部分人访问，逐渐你发现系统的压力越来越高，响应速度越来越慢，而这个时候比较明显的是数据库和应用互相影响，应用出问题了，数据库也很容易出现问题，而数据库出问题的时候，应用也容易
  • 初探Druid连接池之二——慢SQL日志记录 xingsan_zhang 日志连接池druid慢SQL
    由于工作原因，这里先不说连接数据库部分的配置，后面会补上，直接进入慢SQL日志记录。   1.applicationContext.xml中增加如下配置： <bean abstract="true" id="mysql_database" class="com.alibaba.druid.pool.DruidDataSourc
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他