pvfhv
pvfhv

自定义滚动条支持滚轮——主流浏览器全兼容

在开发项目中，经常会用到自定义的滚动条效果，结合鼠标的滚轮事件做到非常绚的效果，具体代码如下，供大家参考：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>自定义滚动条</title>
		<style type="text/css">
			#container {
				width: 300px;
				height: 400px;
				border: solid 1px grey;
				margin: 0 auto;
				position: relative;
				overflow: hidden;
			}
			#div1 {
				width: 280px;
				position: absolute;
				left: 0;
			}
			#div2 {
				width: 20px;
				height: 400px;
				background-color: #999;
				position: absolute;
				right: 0;
			}
			#div3 {
				width: 20px;
				height: 20px;
				background-color: red;
				position: absolute;
				left: 0;
				top: 0;
				cursor: pointer;
			}

		</style>
	</head>
	<body>
		<div id="container">
			<div id="div1">
				相信很多人都遇到过在设计中自定义滚动条样式的情景，之前我都是努力说服设计师接受浏览器自带的滚动条样式，但是这样只能规避还是解决不了问题，最近在项目中遇到了，正好来总结一下。当然，兼容所有浏览器的滚动条样式目前是不存在的。

				IE下的滚动条样式

				IE是最早提供滚动条的样式支持，好多年了，但是其它浏览器一直没有支持，IE独孤求败了。

				这些样式规则很简单：

				scrollbar-arrow-color: color; /*三角箭头的颜色*/

				scrollbar-face-color: color; /*立体滚动条的颜色（包括箭头部分的背景色）*/

				scrollbar-3dlight-color: color; /*立体滚动条亮边的颜色*/

				scrollbar-highlight-color: color; /*滚动条的高亮颜色（左阴影？）*/

				scrollbar-shadow-color: color; /*立体滚动条阴影的颜色*/

				scrollbar-darkshadow-color: color; /*立体滚动条外阴影的颜色*/

				scrollbar-track-color: color; /*立体滚动条背景颜色*/

				scrollbar-base-color: color; /*滚动条的基色*/

				大概就这些，你也可以定义cursor来定义滚动条的鼠标手势。

				这里，很久以前danger做了个基于Flash的可视化工具，简单但是好用选中CSS选项即可自动生成CSS样式，这里不再过多的介绍了。嗯，多谢大猫老湿推荐。

				webkit的自定义滚动条样式

				yes，这里才是今天要重点介绍的。

				从上一部分的样式名中就可以看到，IE只能定义相关部分的color等属性，这样太不灵活了。

				webkit最近实现了对滚动条的支持，先看一个简单的demo：
			</div>
			<div id="div2">
				<div id="div3"></div>
			</div>
		</div>

		<script type="text/javascript" charset="utf-8">
			var oContainer = document.getElementById("container"), oDiv1 = document.getElementById("div1"), oDiv2 = document.getElementById("div2"), oDiv3 = document.getElementById("div3");

			oDiv3.onmousedown = function(e) {
				e = e || event;

				var disY = e.clientY - this.offsetTop;
				
				if(oDiv3.setCapture){
					oDiv3.onmousemove=fnMove;
					oDiv3.onmouseup=fnUp;
					oDiv3.setCapture();
				}else{
					document.onmousemove=fnMove;
					document.onmouseup=fnUp;
				}
				
				function fnMove(ev) {
					ev = ev || event;

					var t = ev.clientY - disY;
					setTop(t);
				};

				function fnUp() {
					this.onmousemove = null;
					this.onmouseup = null;
					
					if(this.releaseCapture){
						this.releaseCapture();
					}
				};

				return false;
			};

			function setTop(t) {
				var down = oDiv2.offsetHeight - oDiv3.offsetHeight;

				if (t < 0) {
					t = 0;
				} else if (t > down) {
					t = down
				}

				oDiv3.style.top = t + 'px';

				var scale = t / down;
				oDiv1.style.top = -(oDiv1.offsetHeight - oContainer.offsetHeight) * scale + 'px';
			}

			addEvent(oDiv1, 'mousewheel', mousewheel);
			addEvent(oDiv1, 'DOMMouseScroll', mousewheel);
			addEvent(oDiv2, 'mousewheel', mousewheel);
			addEvent(oDiv2, 'DOMMouseScroll', mousewheel);

			function addEvent(obj, oEvent, fn) {
				if (obj.attachEvent) {
					obj.attachEvent('on' + oEvent, fn);
				} else {
					obj.addEventListener(oEvent, fn, false);
				}
			}

			function mousewheel(e) {
				var ev = e || event, bDown = false;

				bDown = ev.wheelDelta ? ev.wheelDelta < 0 : ev.detail > 0;
				
				if (bDown) {
					setTop(oDiv3.offsetTop+10);
				}else{
					setTop(oDiv3.offsetTop-10);
				}

				//FF,绑定事件，阻止默认事件
				if (e.preventDefault) {
					e.preventDefault();
				}

				return false;
			}
		</script>
	</body>
</html>


你可能感兴趣的:(自定义滚动条,滚轮)

  • css滚动条隐藏但是可以滚动 每一天，每一步 HTML/CSScss前端javascript
    要实现滚动条隐藏但仍然可以滚动的效果，可以使用CSS来隐藏滚动条，同时允许鼠标的滚轮或触摸板滚动。/*隐藏滚动条，但仍可滚动*/.scrollable{overflow:auto;/*保持内容可滚动*/scrollbar-width:none;/*对于现代浏览器，隐藏滚动条*/}/*针对IE和Edge的隐藏滚动条样式*/.scrollable::-webkit-scrollbar{display:
  • 5. Fabric 设置画布大小 Lanwarf-前端开发 Fabricfabric
    1.设置宽度canvas.setWidth(width)2.设置高度canvas.setHeight(height)3.设置大小canvas.setDimensions({width,height})4.画布的缩放canvas.on('mouse:wheel',(opt)=>{constdelta=opt.e.deltaY//滚轮，向上滚一下是-100，向下滚一下是100letzoom=canva
  • 收纳的智慧 TanLeeCO
    和中国一样，日本是个寸土寸金的国家，人口密度很大，高昂的房价让日本人练就了收纳的智慧。同样小的一个房子，日本主妇却可以把它变得温馨而整洁。相信很多人都看过哆啦A梦，而蓝胖子睡觉的地方就是日本经典的和式壁橱。和式壁橱有两层，而日本主妇会用规格刚刚好的收纳箱把衣物装起来放好，既节约了空间，又整洁利落，方便放取。日式厨房的收纳也很是让人惊叹，除了嵌入式的厨具装修，还有多层滚轮置物架置放柴米油盐酱醋茶。蜗
  • WPF 中Canvas图像缩放和平移 qzy0621 C#wpfc#
    WPF中Canvas图像缩放和平移使用控件介绍Canvas控件Image控件WPFEllipse控件代码示例缩放时字体失真解决图元图像等图层设置实现功能：图像上放一个图元，同时实现缩放和平移操作缩放操作：使用滚轮实现缩放，缩放原点以鼠标为中心平移操作：按住鼠标右键，随鼠标平移缩放和平移时图元和图像的相对位置不变使用控件介绍Canvas控件主要功能布局：Canvas控件本身也可以作为布局容器，允许在
  • CSS 自定义滚动条样式 MGLMONSTER
    /*定义滚动条高宽及背景高宽分别对应横竖滚动条的尺寸*/::-webkit-scrollbar{width:10px;height:10px;background-color:#F5F5F5;}/*定义滚动条轨道内阴影+圆角*/::-webkit-scrollbar-track{-webkit-box-shadow:inset006pxrgba(0,0,0,0.3);border-radius:1
  • 关于jupyter notebook 的输出 (outputs ) 码龄3年 审核中 jupyteridepython
    jupyternotebook的输出(outputs)在元素达到一定的个数后，就会按一行一个元素进行展示，百来个还好，一旦过千，那滚轮势必撸冒烟，所以能不能解决呢？先看个例子，一个找质数、合数的函数cal3（125），返回的百多个结果被jupyternotebook按一行一个元素的方式展示，右侧有个已经很短的滑条了。截图如下：一个简单的解决办法是：使用print（）函数，打印的结果就不会被jupy
  • 不知我的空调的深度清洗方法与各位是一致的吗？ 小啄的知识法宝
    1、先试机。若试机正常，断掉电源，卸下空调面板、过滤网、摆叶、风叶等。2、全面清洗拆卸的面板、过滤网、摆叶、风叶等，并擦拭干净。3、清扫蒸发器上的灰尘，喷涂环保清洗剂，罩上专利透明清洗罩。4、使用高压水枪对蒸发器、滚轮、出风口进行深度清洗。5、擦拭整机，继续往蒸发器上喷涂清洗剂，启动空调让冷凝水带走内机杂物。6、将空调拆卸部件按原位重新装好，并试机是否正常。不知我的空调的深度清洗方法与各位是一致的
  • 案例：自定义滚动条 kino2046
    Document.wrap{position:relative;border:1pxsolid#000;width:400px;height:400px;padding-right:10px;overflow:hidden;}.scrollBar{position:absolute;right:0;top:0;width:10px;height:100%;background:#ccc;}.scr
  • vue3-巧用指令 qfxietian 前端vuevue.jsjavascript前端VUE开发语言
    不知道大家在工作中用上vue3了没有，vue3好是好，但是有部分插件并没有更新到3.0的，比如我比较喜欢的自定义滚动条overlayscrollbars，vue3直接使用overlayscrollbars-vue会报错。今天我们主要介绍一下如何使用指令来应用这些插件，自定义滚动条overlayscrollbars以及拖拽sortablejs。directive指令的话这里就不多说了，参考官方文档（
  • android 简单快速 实现滚轮控件WheelView（类似DatePicker/TimePicker） 42nf androidWheelView时间选择器
    github地址：GitHub-Bigkoo/Android-PickerView:Thisisapickerviewforandroid,supportlinkageeffect,timepickerandoptionspicker.（时间选择器、省市区三级联动）https://github.com/Bigkoo/Android-PickerView1.引用库implementation'com
  • Cadence Allegro学习笔记【原理图篇】 honey ball 学习单片机嵌入式硬件人工智能算法
    点击下图中的按钮可以打开3D预览模式按住shift和按鼠标中间可以旋转，单独按鼠标中间可以平移动cadence元器件属性摆放横竖模式切换:双击元器件后进入属性对话框，系统默认是横排显示，鼠标选中左侧框上面右击，出现如下对话框选择Pivot之后就变成了竖排,Crtl+鼠标滚轮可以对界面进行放大缩小完整工程的创建：工程文件.opj原理图文件.dsnPCB文件.brd元件库文件.olb有个小BUG,打开
  • 常用快捷键的使用 下雪了 ～ 键盘
    快捷键的使用常用快捷键ctrl+c//复制ctrl+v//粘贴ctrl+x//剪切ctrl+A//全选ctrl+Z//撤销ctrl+Y//恢复ctrl+F//查找CTRL+H//替换ctrl+N//创建新窗口CTRL+W//关闭当前界面CTRL+S//保存CTRL+P//打印CTRL+鼠标滚轮//放大，缩小CTRL+“+”//放大CTRL+“-”//缩小CTRL+“0”//恢复CTRL+shitf
  • three.js记录一下实现模型放大缩小的限制 一只理智恩 javascript开发语言webgl前端
    限制模型的最大放大倍数和最小缩小倍数，可以使用three.js中的缩放操作scale和事件监听器首先，为了使模型可以缩放，需要将缩放属性设置为需要的初始值。例如，将模型的初始缩放设置为1倍：model.scale.set(1,1,1);//model就是加载的模型添加一个事件监听器来响应用户的放大和缩小操作。在监听器函数中，可以通过修改模型的缩放来实现放大和缩小效果。//监听鼠标滚轮事件docum
  • 《丰乳肥臀》：为天下母亲送上的至美赞歌 20级林宏博
    三月，略显暑气的暖阳照射在寝室的窗台上，我拖着沉重的身体呆站在阳台边，一边为上午碌碌无为的自己感到焦虑，一边为接下来的时间如何安排而感到不知所措。回望走过来的14余年的求学旅途，好像14年来我一直如此，没有许多骄人的成绩，就只作为一名普通的普通人被时光的滚轮裹挟着前进。恍惚间，电话响起，联系人界面上显示的“妈妈”二字让我从过去到未来的螺旋梦境中惊醒。我接通电话，电话中母亲的声音从远在千里外的家乡，
  • 知识变现的7种方法 桐榆山房
    用你的知识创造额外收入我有个工作多年的公务员朋友。一周上班五天，朝九晚五。收入尚可，但他感觉生活如同仓鼠滚轮般一眼望得到头。他似乎对自己的工作不是很满意，一度很颓废，总觉得自己选错了职业。我们该如何评价这位朋友的想法呢？博多•舍费在《财务自由之路》这本书中认为，我们不要讨厌自己的工作。因为工作的本质是工资，而不是变得富裕，后者是我们自己的任务。幸运的是，在2015年，他开始认识到可以利用自己的专业
  • AHK的滚轮操作 妹妹好想你
    image.png接下来我们再来看一下aHk对鼠标支持的鼠标滚轮操作是什么样的情况呢？我们点击图中所示的地方便插入了滚轮，大家可以注意一下下面的实现的代码Loop10ClickWheelUp;鼠标向上滚动10次Loop10ClickWheelDown;鼠标向下滚动10次他分别使用到了循环语句和滚轮的操作
  • 53.React学习笔记.自定义hook练习-scroll _生生不息_
    如果我们想在多个组件中获取当前滚轮的位置，并对其进行操作，这时候就需要将逻辑给抽离出来。importReactfrom'react'importuseScrollPositionfrom'../hooks/scroll-position-hook';exportdefaultfunctionCustomScrollPositionHook(){constposition=useScrollPosi
  • VS Code快捷键+插件 AmBestToday #Vuevue
    文章持续更新。。。ctrl+shift+/=>代码格式化Vscode快速格式化代码(快捷键)：shift+alt+f快速查看网页效果插件：openinbrowser中文插件：Chinese(Simplified)(简体中文)LanguagePackforVisualStudioCode使用鼠标Ctrl+滚轮放大缩小打开"文件->首选项->设置->用户->扩展->JSON3.(JSON:Schema
  • Firefox 浏览器的 常用快捷键，Win 截图工具 ken2232 tools杂类杂项
    Firefox浏览器的常用快捷键：显示/隐藏菜单栏：Alt启用/关闭全屏模式：F11放大/缩小：Ctrl+鼠标滚轮；或“缩放“菜单直接设置Firefox自定义浏览器整体显示窗口的大小页面整体放大插件屏幕注释插件/screenannotatortool注：在当前窗口是Firefox时，快捷键才有效。------------Win截图工具Win+Shift+S这是Windows的截图工具，有矩形、任意
  • 【OpenGL】--- OpenGL中实现摄像机自由移动与缩放 Anshn OpenGL计算机视觉图形渲染
    在使用Qt和OpenGL开发图形应用程序时，实现摄像机的自由移动和缩放是一个常见的需求。在本篇博客中，我们将介绍如何创建一个摄像机类，以实现用户可以通过键盘和鼠标交互来控制场景中的摄像机。创建摄像机类首先，我们创建一个Camera类，该类封装了摄像机的位置、方向、上向量等信息。摄像机类还提供了用于更新摄像机状态的方法，例如处理键盘输入、鼠标移动和滚轮滚动。camera.h：//camera.h#i
  • 【Linux】如何在 Linux 终端中复制粘贴 NiNi_suanfa Linuxlinux运维服务器
    Linux终端中复制粘贴一、在终端中使用键盘快捷键进行复制粘贴`Ctrl+Shift+C/V`二、在终端中复制和粘贴的另一种方法是使用：右键单击上下文菜单。三、在Linux终端使用鼠标中键（滚轮）复制粘贴四、为什么Linux终端不使用“通用”的`Ctrl+C`和`Ctrl+V`五、`Ctrl+S`冻结终端；`Ctrl+Q`解冻终端一、在终端中使用键盘快捷键进行复制粘贴Ctrl+Shift+C/V在
  • 侠女的成长日记119/130 侠女传奇
    再谈少即是多当我凝视一个陶瓷咖啡杯时，我意识到脆弱性有一个非常简单的定义，由此带出一个非常简单和实用的启发法:一项发现越是简单和明显，我们就越不容易通过复杂的方法将其弄明白。最关键的是，我们只能通过实践来揭示其意义。我感觉滚轮旅行箱就是对我们最大的嘲讽。有多少类似的简单、平凡的启发法正在那儿看着我们和嘲笑我们?在我们生活中会看到太多这样的问题，明明你可以很简单，但是你把它搞得很复杂。正如我们在前面
  • 给自己打打气…… 薰衣草efg
    分享一下，昨天上了一节瑜伽小班课，痛痛痛痛，瑜伽滚轮，像是要滚掉一层皮一样！我是个疼痛感不是很强的人，这次真的痛了！原来是强度大的减脂课！我的肉还是慢慢瘦吧！让我想到做什么都不容易啊，一个瑜伽老师要经过千百次这样的疼痛才能练成，赞叹她们！我也要加油哦！别人行，我也应该可以的！加油！加油！加油！
  • 周末琐事 小数点
    孩子周六第十二次模考完，因数学试题很难，做的不理想，心情不是太好，为了给孩子散心，我们去了西仓，目的是给刺猬买一个滚轮，没有卖的，顺便给刺猬买了面包虫。因走错路，在西仓巷子里兜圈圈，路过粉蒸肉老字号店铺，请孩子吃了粉蒸肉、喝冰峰，味道很棒，得到孩子认可，来西安十多年，这竟然是孩子第一次在回民巷吃粉蒸肉，惭愧啊。某路段两侧坐着成排的老人，有男有女，手中拿着一沓一元人民币，心想这些老人是在兑换什么？难
  • IDEA部分操作调整 两个酒窝～ javaidea
    JDK版本切换人性化设置（以下都在Settings操作）多一个刷新保存工具栏取消自动更新设置主题和大小用滚轮调整字体大小修改注释的颜色显示行号及方法分隔符忽略大小写匹配自动导包配置设置项目编码设置自动编译
  • 时间选取滚轮 CYC666
    1.xib==========================================================2、.h==========================================================3、.m==========================================================4、使用=========
  • 禁止复制？看我F12+F1来搞定 六卿 #jsjs
    话不多说，直接上图让我掏钱？不存在的上步骤1.点开控制台（直接键盘F12）2.控制台出现，再直接F1出现以下3.拉动右侧滚轮到最低，看到DisableJavaScript勾选上就ok了。妈妈再也不用担心我的复制。
  • 零基础学鸿蒙编程-UI控件_Picker 蓝不蓝编程
    什么是PickerPicker是一种滚轮式选择器.常见效果如下：1.基本用法效果图代码2.设置背景效果图代码3.设置文字字体大小和颜色效果图代码4.设置分割条颜色效果图代码基础样例完整源代码https://gitee.com/hspbc/harmonyos_demos/tree/master/pickerDemo常用属性说明属性名用途ohos:width设置控件宽度,可设置为:match_pare
  • QT：界面上重写鼠标事件（画框，鼠标更改） 快跑bug来啦 QTqt计算机外设开发语言
    前言  接上一篇的rtsp播放器，有需要在播放界面手动跟踪，就需要在播放界面绘制矩形框，并把当前鼠标绘制区域的宽高坐标进行换算发送给3559，做进一步处理。绘制矩形框共分为两种，第一种是左键拖动绘制，第二种是直接在鼠标位置绘制固定的矩形框，用鼠标滚轮调动框的大小，再加上退出功能，需求就可以实现了。对于qt来说也比较简单，重写对应的事件即可拖动绘制  首先，我们需要一个基于Qt的图形界面应用程序，以
  • Windows10系统输入法热键设置 maxos
    1、右击“开始”菜单；2、右键菜单中选“设置”条目；3、选“时间和语言”；4、弹出窗中，点击最左侧的“语言”项；5、再点击最右侧的“拼写、键入和键盘设置”；6、鼠标滚轮滚动到最下面，选“高级键盘设置”；7、点选“输入语言热键”。即可打开输入法的热键设置，如下图所示：
  • Enum 枚举 120153216 enum枚举
    原文地址：http://www.cnblogs.com/Kavlez/p/4268601.html Enumeration 于Java 1.5增加的enum type...enum type是由一组固定的常量组成的类型，比如四个季节、扑克花色。在出现enum type之前，通常用一组int常量表示枚举类型。比如这样： public static final int APPLE_FUJI = 0
  • Java8简明教程 bijian1013 javajdk1.8
            Java 8已于2014年3月18日正式发布了，新版本带来了诸多改进，包括Lambda表达式、Streams、日期时间API等等。本文就带你领略Java 8的全新特性。  一.允许在接口中有默认方法实现         Java 8 允许我们使用default关键字，为接口声明添
  • Oracle表维护 快速备份删除数据 cuisuqiang oracle索引快速备份删除
    我知道oracle表分区，不过那是数据库设计阶段的事情，目前是远水解不了近渴。 当前的数据库表，要求保留一个月数据，且表存在大量录入更新，不存在程序删除。 为了解决频繁查询和更新的瓶颈，我在oracle内根据需要创建了索引。但是随着数据量的增加，一个半月数据就要超千万，此时就算有索引，对高并发的查询和更新来说，让然有所拖累。 为了解决这个问题，我一般一个月会进行一次数据库维护，主要工作就是备
  • java多态内存分析 麦田的设计者 java内存分析多态原理接口和抽象类
          “  时针如果可以回头，熟悉那张脸，重温嬉戏这乐园，墙壁的松脱涂鸦已经褪色才明白存在的价值归于记忆。街角小店尚存在吗？这大时代会不会牵挂，过去现在花开怎么会等待。       但有种意外不管痛不痛都有伤害，光阴远远离开，那笑声徘徊与脑海。但这一秒可笑不再可爱，当天心
  • Xshell实现Windows上传文件到Linux主机 被触发 windows
    经常有这样的需求，我们在Windows下载的软件包，如何上传到远程Linux主机上？还有如何从Linux主机下载软件包到Windows下；之前我的做法现在看来好笨好繁琐，不过也达到了目的，笨人有本方法嘛； 我是怎么操作的： 1、打开一台本地Linux虚拟机，使用mount 挂载Windows的共享文件夹到Linux上，然后拷贝数据到Linux虚拟机里面；（经常第一步都不顺利，无法挂载Windo
  • 类的加载ClassLoader 肆无忌惮_ ClassLoader
    类加载器ClassLoader是用来将java的类加载到虚拟机中，类加载器负责读取class字节文件到内存中，并将它转为Class的对象（类对象），通过此实例的 newInstance()方法就可以创建出该类的一个对象。   其中重要的方法为findClass(String name)。   如何写一个自己的类加载器呢？ 首先写一个便于测试的类Student
  • html5写的玫瑰花 知了ing html5
    <html> <head> <title>I Love You!</title> <meta charset="utf-8" /> </head> <body> <canvas id="c"></canvas>
  • google的ConcurrentLinkedHashmap源代码解析 矮蛋蛋 LRU
    原文地址： http://janeky.iteye.com/blog/1534352 简述 ConcurrentLinkedHashMap 是google团队提供的一个容器。它有什么用呢？其实它本身是对 ConcurrentHashMap的封装，可以用来实现一个基于LRU策略的缓存。详细介绍可以参见 http://code.google.com/p/concurrentlinke
  • webservice获取访问服务的ip地址 alleni123 webservice
    1. 首先注入javax.xml.ws.WebServiceContext, @Resource private WebServiceContext context; 2. 在方法中获取交换请求的对象。 javax.xml.ws.handler.MessageContext mc=context.getMessageContext(); com.sun.net.http
  • 菜鸟的java基础提升之道——————>是否值得拥有 百合不是茶
    1，c++，java是面向对象编程的语言，将万事万物都看成是对象；java做一件事情关注的是人物，java是c++继承过来的，java没有直接更改地址的权限但是可以通过引用来传值操作地址，java也没有c++中繁琐的操作，java以其优越的可移植型，平台的安全型，高效性赢得了广泛的认同，全世界越来越多的人去学习java，我也是其中的一员      java组成：
  • 通过修改Linux服务自动启动指定应用程序 bijian1013 linux
    Linux中修改系统服务的命令是chkconfig (check config)，命令的详细解释如下: chkconfig 功能说明：检查，设置系统的各种服务。 语　　法：chkconfig [ -- add][ -- del][ -- list][系统服务] 或 chkconfig [ -- level  <</SPAN>
  • spring拦截器的一个简单实例 bijian1013 javaspring拦截器Interceptor
    Purview接口 package aop; public interface Purview { void checkLogin(); } Purview接口的实现类PurviesImpl.java package aop; public class PurviewImpl implements Purview { public void check
  • [Velocity二]自定义Velocity指令 bit1129 velocity
    什么是Velocity指令 在Velocity中，#set,#if, #foreach, #elseif, #parse等，以#开头的称之为指令，Velocity内置的这些指令可以用来做赋值，条件判断，循环控制等脚本语言必备的逻辑控制等语句，Velocity的指令是可扩展的，即用户可以根据实际的需要自定义Velocity指令   自定义指令(Directive)的一般步骤 &nbs
  • 【Hive十】Programming Hive学习笔记 bit1129 programming
    第二章 Getting Started 1.Hive最大的局限性是什么？一是不支持行级别的增删改(insert, delete, update)二是查询性能非常差(基于Hadoop MapReduce）,不适合延迟小的交互式任务三是不支持事务2. Hive MetaStore是干什么的？Hive persists table schemas and other system metadata.
  • nginx有选择性进行限制 ronin47 nginx 动静　限制
    http { limit_conn_zone $binary_remote_addr zone=addr:10m; limit_req_zone $binary_remote_addr zone=one:10m rate=5r/s;... server {... location ~.*\.(gif|png|css|js|icon)$ {
  • java-4.-在二元树中找出和为某一值的所有路径 . bylijinnan java
    /* * 0.use a TwoWayLinkedList to store the path.when the node can't be path,you should/can delete it. * 1.curSum==exceptedSum:if the lastNode is TreeNode,printPath();delete the node otherwise
  • Netty学习笔记 bylijinnan javanetty
    本文是阅读以下两篇文章时： http://seeallhearall.blogspot.com/2012/05/netty-tutorial-part-1-introduction-to.html http://seeallhearall.blogspot.com/2012/06/netty-tutorial-part-15-on-channel.html 我的一些笔记 ===
  • js获取项目路径 cngolon js
    //js获取项目根路径，如： http://localhost:8083/uimcardprj function getRootPath(){     //获取当前网址，如： http://localhost:8083/uimcardprj/share/meun.jsp     var curWwwPath=window.document.locati
  • oracle 的性能优化 cuishikuan oracleSQL Server
       在网上搜索了一些Oracle性能优化的文章，为了更加深层次的巩固[边写边记]，也为了可以随时查看，所以发表这篇文章。     1.ORACLE采用自下而上的顺序解析WHERE子句，根据这个原理，表之间的连接必须写在其他WHERE条件之前，那些可以过滤掉最大数量记录的条件必须写在WHERE子句的末尾。（这点本人曾经做过实例验证过，的确如此哦！
  • Shell变量和数组使用详解 daizj linuxshell变量数组
    Shell 变量 定义变量时，变量名不加美元符号（$，PHP语言中变量需要），如： your_name="w3cschool.cc" 注意，变量名和等号之间不能有空格，这可能和你熟悉的所有编程语言都不一样。同时，变量名的命名须遵循如下规则： 首个字符必须为字母（a-z，A-Z）。 中间不能有空格，可以使用下划线（_）。 不能使用标点符号。 不能使用ba
  • 编程中的一些概念，KISS、DRY、MVC、OOP、REST dcj3sjt126com REST
    KISS、DRY、MVC、OOP、REST （1）KISS是指Keep It Simple,Stupid（摘自wikipedia），指设计时要坚持简约原则，避免不必要的复杂化。 （2）DRY是指Don't Repeat Yourself（摘自wikipedia），特指在程序设计以及计算中避免重复代码，因为这样会降低灵活性、简洁性，并且可能导致代码之间的矛盾。 （3）OOP 即Object-Orie
  • [Android]设置Activity为全屏显示的两种方法 dcj3sjt126com Activity
    1. 方法1：AndroidManifest.xml 里，Activity的 android:theme  指定为" @android:style/Theme.NoTitleBar.Fullscreen" 示例:   <application      
  • solrcloud 部署方式比较 eksliang solrCloud
    solrcloud 的部署其实有两种方式可选，那么我们在实践开发中应该怎样选择呢？ 第一种：当启动solr服务器时，内嵌的启动一个Zookeeper服务器，然后将这些内嵌的Zookeeper服务器组成一个集群。  第二种：将Zookeeper服务器独立的配置一个集群，然后将solr交给Zookeeper进行管理   谈谈第一种：每启动一个solr服务器就内嵌的启动一个Zoo
  • Java synchronized关键字详解 gqdy365 synchronized
    转载自：http://www.cnblogs.com/mengdd/archive/2013/02/16/2913806.html 多线程的同步机制对资源进行加锁，使得在同一个时间，只有一个线程可以进行操作，同步用以解决多个线程同时访问时可能出现的问题。 同步机制可以使用synchronized关键字实现。 当synchronized关键字修饰一个方法的时候，该方法叫做同步方法。 当s
  • js实现登录时记住用户名 hw1287789687 记住我记住密码cookie记住用户名记住账号
    在页面中如何获取cookie值呢? 如果是JSP的话,可以通过servlet的对象request 获取cookie,可以 参考:http://hw1287789687.iteye.com/blog/2050040 如果要求登录页面是html呢?html页面中如何获取cookie呢? 直接上代码了 页面:loginInput.html 代码: <!DOCTYPE html PUB
  • 开发者必备的 Chrome 扩展 justjavac chrome
    Firebug：不用多介绍了吧https://chrome.google.com/webstore/detail/bmagokdooijbeehmkpknfglimnifench ChromeSnifferPlus：Chrome 探测器，可以探测正在使用的开源软件或者 js 类库https://chrome.google.com/webstore/detail/chrome-sniffer-pl
  • 算法机试题 李亚飞 java算法机试题
           在面试机试时，遇到一个算法题，当时没能写出来，最后是同学帮忙解决的。        这道题大致意思是：输入一个数，比如4,。这时会输出：           &n
  • 正确配置Linux系统ulimit值 字符串 ulimit
    在Linux下面部 署应用的时候，有时候会遇上Socket/File: Can’t open so many files的问题；这个值也会影响服务器的最大并发数，其实Linux是有文件句柄限制的，而且Linux默认不是很高，一般都是1024，生产服务器用 其实很容易就达到这个数量。下面说的是，如何通过正解配置来改正这个系统默认值。因为这个问题是我配置Nginx+php5时遇到了，所以我将这篇归纳进
  • hibernate调用返回游标的存储过程 Supanccy2013 javaDAOoracleHibernatejdbc
    注：原创作品，转载请注明出处。     上篇博文介绍的是hibernate调用返回单值的存储过程，本片博文说的是hibernate调用返回游标的存储过程。     此此扁博文的存储过程的功能相当于是jdbc调用select 的作用。 1，创建oracle中的包，并在该包中创建的游标类型。 ---创建oracle的程
  • Spring 4.2新特性-更简单的Application Event wiselyman application
    1.1 Application Event Spring 4.1的写法请参考10点睛Spring4.1-Application Event 请对比10点睛Spring4.1-Application Event 使用一个@EventListener取代了实现ApplicationListener接口,使耦合度降低; 1.2 示例 包依赖 <p
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他