Js 鼠标拖拽div改变其大小

想让div实现拖拽改变大小功能，类似于soso地图的看街景时地图可以拖拽等功能

Js 鼠标拖拽div改变其大小

分析一下，实现这个功能需要：鼠标按下，鼠标移动和鼠标抬起几个功能方能实现，那么找到相应的js事件：mousedown、mousemove、mouseup

找到这几个事件，基本上我们的功能可以说完成了一半了，只需要在里面做相应事件处理就能搞定了，具体看下代码，很简单的操作：

拖拽div 
  1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  2 

  3 <html xmlns="http://www.w3.org/1999/xhtml">

  4 <head runat="server">

  5     <title></title>

  6 </head>

  7 <body>

  8     <div id="StreetOverviewFrame" tabindex="-1" style="position: absolute; right: 10px; bottom: 10px;

  9         z-index: 200; overflow: hidden; visibility: visible; width: 771px; height: 150px;background-color:Red;">

 10         <div id="mapContainer" style="position: absolute; width: 100%; height: 100%; top: 0px;

 11             left: 0px;">

 12         </div>

 13         <div id="tz" style="position: absolute; left: 1px; top: 1px; width: 28px; height: 28px; cursor: se-resize;

 14             z-index: 200001; background-image: url(&quot;about:blank&quot;);">

 15             <div title="拖动调整大小" style="position: absolute; left: 0px; top: 0px; width: 27px;

 16                 height: 20px; cursor: se-resize; z-index: 100; background-image: url(&quot;http://s.map.soso.com/themes/default/img/street/overview_control.png?v=v3.3.805&quot;);

 17                 background-position: 0px 0px;">

 18             </div>

 19         </div>

 20     </div>

 21     <script type="text/javascript" src="/Js/mobile/jquery.js"></script>

 22     <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>

 23     <script type="text/javascript">

 24         var obj = null;

 25         var divObj = null;

 26         var deltaX, deltaY,_startX,_startY;

 27         $(document).ready(function () {

 28             obj = document.getElementById("tz");

 29             divObj = document.getElementById("StreetOverviewFrame");

 30 

 31             obj.addEventListener('mousedown', function (event) {

 32                 //将鼠标位置转为文档坐标

 33                 var scroll = getScrollOffsets();

 34                 var startX = event.clientX + scroll.x;

 35                 var startY = event.clientY + scroll.y;

 36 

 37                 _startX = parseInt(startX);

 38                 _startY = parseInt(startY);

 39                 if (document.addEventListener) {

 40                     document.addEventListener("mousemove", moveHandler, true);

 41                     document.addEventListener("mouseup", upHandler, true);

 42                 } else if (document.attachEvent) {

 43                     obj.setCapture();

 44                     obj.attachEvent("onlosecapeture", upHandler);

 45                     obj.attachEvent("onmouseup", upHandler);

 46                     obj.attachEvent("onmousemove", moveHandler);

 47 

 48                 }

 49 

 50                 //处理了这个事件，不让任何其它元素看到它

 51                 if (event.stopPropagation) event.stopPropagation(); //标准模型

 52                 else event.cancelBubble = true;

 53 

 54                 //现在阻止任何默认操作

 55                 if (event.preventDefault) event.preventDefault();

 56                 else event.returnValue = false;

 57             });

 58 

 59             MapInIt();

 60 

 61             $("#StreetOverviewFrame").mouseover(function () {

 62                 navControl.show();

 63             }).mouseout(function () {

 64                 navControl.hide();

 65             });

 66         });

 67 

 68         function moveHandler(e) {

 69             if (!e) e = window.event; //ie事件模型

 70             var startX =parseInt(e.clientX);

 71             var startY =parseInt(e.clientY);

 72 

 73             deltaX = startX - _startX;

 74             deltaY = startY - _startY;

 75             if (_startX > startX) {

 76                 divObj.style.width = ($("#StreetOverviewFrame").width() - deltaX) + "px";

 77             } else {

 78                 divObj.style.width = ($("#StreetOverviewFrame").width() - deltaX) + "px";

 79             }

 80 

 81             if (_startY > startY) {

 82                 divObj.style.height = ($("#StreetOverviewFrame").height() - deltaY) + "px";

 83             } else {

 84                 divObj.style.height = ($("#StreetOverviewFrame").height() - deltaY) + "px";

 85             }

 86             _startX = startX;

 87             _startY = startY;

 88             if (e.stopPropagation) e.stopPropagation(); //标准模型

 89             else e.cancelBubble = true;

 90         }

 91 

 92         function upHandler(e) {

 93             if (!e) e = window.event; //ie事件模型

 94             //注销捕获事件处理程序

 95             if (document.removeEventListener) {

 96                 document.removeEventListener("mousemove", moveHandler, true);

 97                 document.removeEventListener("mouseup", upHandler, true);

 98             } else if (document.detachEvent) {

 99                 obj.detachEvent("onlosecapeture", upHandler);

100                 obj.detachEvent("onmouseup", upHandler);

101                 obj.detachEvent("onmousemove", moveHandler);

102                 obj.releaseCapture();

103             }

104             

105 

106             if (e.stopPropagation) e.stopPropagation(); //标准模型

107             else e.cancelBubble = true;

108         }

109 

110         //以一个对象的x和y属性的方式返回滚动条的偏移量

111         function getScrollOffsets(w) {

112             // 使用指定的窗口，如果不带参数则使用当前窗口

113             w = w || window;

114             // 除了IE8及更早的版本以外，其它浏览器版本都能用

115             if (w.pageXOffset != null) return { x: w.pageXOffset, y: w.pageYOffset };

116 

117             // 对标准模式下的IE（或任何浏览器）

118             var d = w.document;

119             if (document.compatMode == "CSS1Compat")

120                 return { x: d.documentElement.scrollLeft, y: d.documentElement.scrollTop };

121 

122             //对怪异模式下的浏览器

123             return { x: d.body.scrollLeft, y: d.body.scrollTop };

124         }

125         var navControl = null;

126         //初始化地图

127         function MapInIt() {

128             map = new BMap.Map("mapContainer");

129             var point = new BMap.Point(121.1234, 31.1234);

130             map.centerAndZoom(point, 12);

131             navControl = new BMap.NavigationControl();

132             map.addControl(navControl); //添加导航条

133             map.addControl(new BMap.ScaleControl()); //添加比例尺控件

134             //地图惯性拖拽

135             map.enableInertialDragging();

136             //地图滚轮

137             map.enableScrollWheelZoom();

138         }

139         

140     </script>

141 </body>

142 </html>

 

 

你可能感兴趣的:(div)

  • 一只亚洲水牛跳水视频提示词-一语乾坤韵芳华-仙界AI——仙盟创梦IDE 未来之窗软件服务 人工智能人工智能东方仙盟仙盟创梦IDEAI视频
    提示词奥运会期间，一只亚洲水牛，从10米高的跳水板，跳向游泳池，慢走几步起跳，跳跃过程中进行后空翻转，进入游泳池溅起水花，电视镜头英文DuringtheOlympicGames,anAsianwaterbuffalojumpedintotheswimmingpoolfroma10-meter-highdivingboard.Itwalkedslowlyforafewstepsbeforetakin
  • 和李沐老师学深度学习--2.数据操作部分代码实现（学习笔记）
    大家对代码有不懂地方都可以上网去查找，最好是有一定的数据分析基础比较容易理解，李沐老师课程视频链接我放在这里了大家有不懂都可以观看课程进行学习04数据操作+数据预处理【动手学深度学习v2】_哔哩哔哩_bilibili深度学习课程电子书：大家可以使用翻译插件观看书的内容Preface—DiveintoDeepLearning1.0.3documentation深度学习github项目：https:/
  • C++快速排序算法详解与实现 小小的博客 排序算法c++算法排序算法c++排序算法
    快速排序（QuickSort）是一种高效的排序算法，由英国计算机科学家东尼·霍尔（TonyHoare）于1960年发明。本文将详细讲解快速排序算法的原理和实现，并通过C++语言展示其代码实现。1.快速排序算法原理快速排序算法的基本思想是分治法（DivideandConquer），其核心步骤如下：1.选择一个基准元素（pivot），通常选择序列中的第一个或最后一个元素。2.将序列分为两部分，一部分是
  • Java Fork/Join 框架详解 empti_ 数据结构与算法java
    JavaFork/Join框架详解Fork/Join框架是Java7引入的一个并行编程框架，专门设计用来高效地实现分治算法（Divide-and-Conquer）。它通过工作窃取（Work-Stealing）算法来最大化多核处理器的利用率。一、核心概念1.基本组成ForkJoinPool：特殊的线程池，管理工作线程ForkJoinTask：表示任务的抽象类，有两个重要子类：RecursiveAct
  • 使用CSS和HTML实现3D图片环绕效果 码力无边-OEC csshtml3dweb前端
    使用CSS和HTML实现3D图片环绕效果在本篇博客中，将介绍如何使用HTML和CSS实现一个3D图片环绕效果。这个效果不仅具有视觉吸引力，而且具有高度的互动性，鼠标悬停时动画会暂停。接下来将一步步讲解这个效果的实现过程。1.效果2.页面结构与布局首先，我们来看一下HTML的基本结构。该效果的核心是一个元素，它包含了多个图片的，每个div中都设置了不同的背景图片。HTML代码：3D图片环绕效果</
  • 2025年6月 CANN Ascend C算子开发能力认证（中级）环境(ascend910b)与代码 红目香薰 华为CouldAPI人工智能系列c语言开发语言
    前言证书开头，并且我要说明的是我一周多的时间，各种参考，各种学习，各种填坑，终于搞出来了。可以在证书上看到我是6月5日通过的，但是我开始的时候是在5月27日。真心的不容易，终于在6月5日当天搞定了AscendC::Div函数的使用，最终通过了考试。目录前言环境说明心得分享1、环境踩坑2、加载一个特殊的文件3、修改文件列表4、基础代码5、核心代码（密）6、给予权限总结环境说明我这里使用的是华为的Mo
  • pytorch-数学运算 码啥码 深度学习之pytorchpytorch深度学习python
    四则运算加减乘除add+sub-mul*div/a=torch.rand(3,4)b=torch.rand(4)a,b'''(tensor([[0.2384,0.5022,0.7100,0.0400],[0.1716,0.0894,0.0795,0.1456],[0.7635,0.9423,0.7649,0.3379]]),tensor([0.8526,0.8296,0.1845,0.7922])
  • CSS实标题现同心圆的缩放 做一个暴躁的开发 css3html
    CSS实标题现同心圆的缩放最近学习了css动画效果，记录一下同心圆的缩放问题问题描述我先设置了两个div，外圈是class=“one”，内圈是class=“two”,代码如下：分别设置他们的div，给他们边框，并且设置成圆形.one{width:500px;height:500px;border:20pxsolidlightcoral;border-radius:50%;overflow:hidd
  • 使用html+css+jquery实现3D轮播图 mini_055 jqueryhtmlcss
    还是先来看看效果图：通过效果图我们先理一下思路：首先就是需要几张图片，但只有一张是显示在我们眼前的第二步：把一张图片分成几等份，这样点击转换的时候就会分开转第三步：就是实现点击按钮切换下一张。HTML部分HTML部分首先我们需要一个盒子显示图片，然后在盒子里装入图片，你想装几张图片就可以写几个li,除了图片我们还需要一个按钮来点击。一个li的图片效果如图所示：div是当你点击下一张的时候一个div
  • css实现圆环效果 春风欲雨 csscss圆环
    圆环效果图.div{width:100px;height:100px;background-color:#fbc2eb;border-radius:50%;}.div:after{content:"";display:block;width:50px;height:50px;border-radius:50%;background-color:#fff;position:relative;top:
  • python xpath语法-Python Xpath语法 weixin_37988176
    一、python数据提取xpath1.beautifulsoupxpath正则表达式2.xpath是一种在XML和HTML文档中查找信息的语言，可用来在XML和HTML中对元素进行遍历ChromeXPathHelper3.XPath语法（1）选取节点：使用路径表达式来选取文档中的节点nodename选取节点的所有子节点//div/如果是在最前面，代表从根节点选取，否则选择某节点下的某个节点一个/代
  • Educational Codeforces Round 180 (Rated for Div. 2) A-D题解 AKDreamer_HeXY Codeforces题解CodeforcesC++STL算法图论
    A.Race题意在一个数轴上，奖品可能出现在xxx点或yyy点，Alice现在在aaa点，请问Bob是否存在一个点bbb，使得无论奖品出现在xxx点还是yyy点，Bob都能比Alice先拿到（∣b−x∣yx>yx>y就交换一下）。如果aya>ya>y，Bob一定可以选择aaa左边的那个点作为点bbb，显然也满足∣b−x∣∣a−x∣|b-x|>|a-x|∣b−x∣>∣a−x∣和∣b−y∣>∣a−y∣
  • 推荐项目：hedera——Unity的3D常春藤模拟生长工具 施刚爽
    推荐项目：hedera——Unity的3D常春藤模拟生长工具hederapaint3DivyintheUnityEditor,watchprocedurallygeneratedmeshessimulategrowthandclinginginreal-time项目地址:https://gitcode.com/gh_mirrors/he/hedera项目介绍hedera是一个专门为Unity开发者
  • markRaw jjjjjjjjj¢ vue.jsjavascript前端
    Vue3中的markRaw()函数markRaw()是Vue3响应式系统中的一个API，用于标记一个对象，使其永远不会被转换为响应式代理。这在您希望确保对象保持原始状态且不触发响应式更新时非常有用。工作中使用带的例子：chartInstance.value=markRaw(echarts.init(chartRef.valueasHTMLDivElement));为什么需要markRaw？ECha
  • 【学习】《算法图解》第四章学习笔记：分而治之与快速排序 程序员
    前言《算法图解》第四章引入了一种强大的算法设计策略——分而治之(DivideandConquer,D&C)。这种策略将复杂问题分解为更小、更易于管理的部分，然后递归地解决这些部分，最终合并结果。作为D&C策略的经典应用，本章详细介绍了快速排序(Quicksort)算法，它是一种非常高效且广泛使用的排序方法。本笔记将梳理D&C的核心思想以及快速排序的实现原理与性能分析。一、分而治之(Dividean
  • CSS 单行溢出文本显示省略号...的方法（兼容IE FF） dai0941
    新闻列表是很多网站都有的，写页面时经常遇到，看到这么详细的教程怎么能不转~留着参考用~~===================================================html代码：CSSWebDesign我爱CSS-Web标准化Div+css教程-www.52css.comcss代码：div{width:200px;/*容器的基本定义*/height:200px;backg
  • 5种使用CSS实现div四角边框的实用方法 云网在线_oaken CSScss前端
    5种使用CSS实现div四角边框的实用方法/*基础容器样式*/.container{width:300px;height:200px;margin:50px;position:relative;padding:20px;}/*方法1：伪元素定位法*/.method1{background:#f5f5f5;}.method1::before,.method1::after{content:'';po
  • 什么是分而治之？
    在软件开发中，"分而治之"（DivideandConquer）是一种常见的设计和算法策略，旨在解决复杂问题的方法。这种策略基本思想是将一个大问题分解成较小的子问题，然后分别解决这些子问题，最终将它们的解合并起来得到原始问题的解决方案。分而治之的主要步骤包括：分解问题：将原始问题分解成较小的子问题，通常是相同类型的问题或者可以通过相似的方法解决的问题。递归求解：对每个子问题递归地应用分而治之的策略，
  • C. Two Colors-Educational Codeforces Round 176 (Rated for Div. 2) 9527过了头 codeforces刷题算法c++数据结构
    Monocarphasinstalledanewfenceathissummerhouse.Thefenceconsistsofnplanksofthesamesizearrangedinarow.Monocarpdecidedthathewouldpainthisfenceaccordingtothefollowingrules:eachplankofthefencewillbepaintedi
  • TIP-2025《Data Subdivision Based Dual-Weighted Robust Principal Component Analysis》 Christo3 机器学习人工智能机器学习算法
    核心思想分析这篇论文提出了一个新颖的主成分分析（PCA）方法，称为DataSubdivisionBasedDual-WeightedRobustPrincipalComponentAnalysis(DRPCA)，旨在解决传统PCA在处理包含噪声和异常值的数据时的鲁棒性问题。其核心思想包括以下几个方面：数据细分与双权重机制：传统PCA假设数据已中心化，并使用平方l2l_2l2-范数，这对噪声和异常值
  • 走进未来：加密货币时代的比特币探索
    背景简介本书《Bitcoin:ADeepDiveintoBitcoinintheAgeofCryptocurrency》深入分析了比特币以及加密货币对现代社会可能产生的深远影响。通过对比计算机技术从1950年代的起步，作者展望了加密货币，特别是比特币，可能引领我们进入的未来世界。本文将探讨这一未来趋势，并反思加密货币的未来及其对社会的潜在影响。比特币与未来世界的关联在第21章中，作者提出一个假设，
  • HTML表中的自动换行 asdfgh0077 htmlcsshtml-table
    我一直在使用word-wrap:break-word将文本div和span。但是，它似乎在表单元格中不起作用。我有一个表设置为width:100%，有一行和两列。列中的文本尽管使用上述word-wrap样式设置，但不会自动换行。它导致文本超出单元格的边界。这发生在Firefox，GoogleChrome和InternetExplorer上。来源如下所示：td{border:1pxsolid;}Lo
  • 【vue+leaflet】vue使用leaflet.pm保存绘制后的图层的点位信息、图层回显、平面图切换、地图事件函数、图层事件函数说明(二) 杨同学* leafletvue.jsjavascriptleaflet
    看效果展示:【vue+leaflet】第二节效果展示视频1.平面图切换,多个平面图切换展示<divclass
  • 【补题】Educational Codeforces Round 107 (Rated for Div. 2) D. Min Cost String 2401_87294509 算法
    题意：要求你给出一个长度为n的字符串，其中只能出现小写字母的前k个字符。要求s[i]==s[j],s[i+1]==s[j+1]出现的次数最少。思路：D.MinCostString（贪心+构造）-CSDN博客因为没有距离贡献之类的，所以让两个连着字符的字符出现最少就可以了。但是光考虑aaabba这种不行，因为你构造出来的字符串可能无意中出现了相同。直接思考最好的字符串其实就是aabacadbbcbd
  • 【补题】Codeforces Round 715 (Div. 2) C. The Sports Festival 2401_87294509 算法
    题意：给你一个序列，你可以对它重新排序，然后使每个i，max(a0,a1……ai)-min(a0,a1……ai)最小。问答案是多少思路：C.TheSportsFestival（区间DP）-CSDN博客区间dp，完全没想到。首先有两个观察点很简单1.一个已经选择好的序列，添加进来的数，如果是最小，或者最大会更新状态，否则不。2.在添加的过程中，添加进来的数改变两个最值的时候越延迟，次数越多越好。13
  • CSS：使用线性渐变实现标签三角形角标效果/HTML上标、下标 某只杂鱼 前端csshtmlHTML角标
    文章目录需求描述实现思路参考代码HTMLCSS在线运行HTML上标、下标条状角标参考网址需求描述想要实现标签右上角带有三角形角标的效果，且不希望使用图标或新建div实现角标效果，效果如图：实现思路可以将标签右上角的三角形角标理解为与主体颜色不同的背景色，由此想到：可以使用线性渐变实现！哦，我真的好dio☆▽☆参考代码HTML我是右上角带三角形角标的标签右下角~我是左下角带三角形角标的标签！左上角.
  • CSS-浮动与Flex 鷇韩 webcss前端html
    标准流标准流标准流标准流也叫文档流，指的是标签在页面中默认的排布规则例如:块元素独占一行，行内元素可以一行显示多个。浮动-基本使用浮动.div1{width:100px;height:100px;background-color:brown;float:left;}.div2{width:200px;height:200px;background-color:orange;}浮动作用：让块元素水平
  • CSS 背景样式笔记（含示例+解释） 希希不嘻嘻～傻希希 csshtml前端css笔记html5
    一、背景颜色（background-color）语法：background-color:颜色值;示例：body{background-color:#f0f0f0;}二、背景图片（background-image）语法：background-image:url(“图片路径”);示例：div{background-image:url(“background.jpg”);}三、背景重复（backgrou
  • 前端 flex弹性布局之弹性布局中文换行 默默地写代码 htmlflex布局前端html5flex布局
    阮一峰布局语法：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.htmlFlex布局实例篇：http://www.ruanyifeng.com/blog/2015/07/flex-examples.html我是第一66666在此不讲flex布局语法跟实例，请参考以上阮一峰老师的教程。主要提醒大家注意：在使用弹性布局的时候，如果div内部写的是
  • .NET 9 MAUI News SEO-狼术 netDelphiCrackwpf
    .NET9MAUINewsGrialUIKit2025.1addsnewRTL(right-to-left)supportwhichdeliversamoreresponsiveandconsistentexperienceforglobalapplications.GrialUIKitbyUXDiversisacollectionofpre-designeduserinterfacecompon
  • Hadoop(一) 朱辉辉33 hadooplinux
    今天在诺基亚第一天开始培训大数据，因为之前没接触过Linux，所以这次一起学了，任务量还是蛮大的。 首先下载安装了Xshell软件，然后公司给了账号密码连接上了河南郑州那边的服务器，接下来开始按照给的资料学习，全英文的，头也不讲解，说锻炼我们的学习能力，然后就开始跌跌撞撞的自学。这里写部分已经运行成功的代码吧.    在hdfs下，运行hadoop fs -mkdir /u
  • maven An error occurred while filtering resources blackproof maven报错
    转：http://stackoverflow.com/questions/18145774/eclipse-an-error-occurred-while-filtering-resources   maven报错： maven An error occurred while filtering resources   Maven -> Update Proje
  • jdk常用故障排查命令 daysinsun jvm
    linux下常见定位命令： 1、jps      输出Java进程       -q       只输出进程ID的名称，省略主类的名称；       -m      输出进程启动时传递给main函数的参数；     &nb
  • java 位移运算与乘法运算 周凡杨 java位移运算乘法
      对于 JAVA 编程中，适当的采用位移运算，会减少代码的运行时间，提高项目的运行效率。这个可以从一道面试题说起：     问题： 用最有效率的方法算出2 乘以8 等於几?” 答案：2 << 3 由此就引发了我的思考，为什么位移运算会比乘法运算更快呢？其实简单的想想，计算机的内存是用由 0 和 1 组成的二
  • java中的枚举(enmu) g21121 java
    从jdk1.5开始，java增加了enum(枚举)这个类型，但是大家在平时运用中还是比较少用到枚举的，而且很多人和我一样对枚举一知半解，下面就跟大家一起学习下enmu枚举。先看一个最简单的枚举类型，一个返回类型的枚举： public enum ResultType { /** * 成功 */ SUCCESS, /** * 失败 */ FAIL,
  • MQ初级学习 510888780 activemq
    1.下载ActiveMQ 去官方网站下载：http://activemq.apache.org/ 2.运行ActiveMQ 解压缩apache-activemq-5.9.0-bin.zip到C盘，然后双击apache-activemq-5.9.0-\bin\activemq-admin.bat运行ActiveMQ程序。 启动ActiveMQ以后，登陆：http://localhos
  • Spring_Transactional_Propagation 布衣凌宇 springtransactional
    //事务传播属性 @Transactional(propagation=Propagation.REQUIRED)//如果有事务，那么加入事务，没有的话新创建一个 @Transactional(propagation=Propagation.NOT_SUPPORTED)//这个方法不开启事务 @Transactional(propagation=Propagation.REQUIREDS_N
  • 我的spring学习笔记12-idref与ref的区别 aijuans spring
    idref用来将容器内其他bean的id传给<constructor-arg>/<property>元素，同时提供错误验证功能。例如： <bean id ="theTargetBean" class="..." /> <bean id ="theClientBean" class=&quo
  • Jqplot之折线图 antlove jsjqueryWebtimeseriesjqplot
    timeseriesChart.html <script type="text/javascript" src="jslib/jquery.min.js"></script> <script type="text/javascript" src="jslib/excanvas.min.js&
  • JDBC中事务处理应用 百合不是茶 javaJDBC编程事务控制语句
      解释事务的概念; 事务控制是sql语句中的核心之一;事务控制的作用就是保证数据的正常执行与异常之后可以恢复   事务常用命令:             Commit提交         
  • [转]ConcurrentHashMap Collections.synchronizedMap和Hashtable讨论 bijian1013 java多线程线程安全HashMap
    在Java类库中出现的第一个关联的集合类是Hashtable，它是JDK1.0的一部分。 Hashtable提供了一种易于使用的、线程安全的、关联的map功能，这当然也是方便的。然而，线程安全性是凭代价换来的――Hashtable的所有方法都是同步的。此时，无竞争的同步会导致可观的性能代价。Hashtable的后继者HashMap是作为JDK1.2中的集合框架的一部分出现的，它通过提供一个不同步的
  • ng-if与ng-show、ng-hide指令的区别和注意事项 bijian1013 JavaScriptAngularJS
            angularJS中的ng-show、ng-hide、ng-if指令都可以用来控制dom元素的显示或隐藏。ng-show和ng-hide根据所给表达式的值来显示或隐藏HTML元素。当赋值给ng-show指令的值为false时元素会被隐藏，值为true时元素会显示。ng-hide功能类似，使用方式相反。元素的显示或
  • 【持久化框架MyBatis3七】MyBatis3定义typeHandler bit1129 TypeHandler
    什么是typeHandler? typeHandler用于将某个类型的数据映射到表的某一列上，以完成MyBatis列跟某个属性的映射   内置typeHandler MyBatis内置了很多typeHandler，这写typeHandler通过org.apache.ibatis.type.TypeHandlerRegistry进行注册，比如对于日期型数据的typeHandler，
  • 上传下载文件rz,sz命令 bitcarter linux命令rz
    刚开始使用rz上传和sz下载命令： 因为我们是通过secureCRT终端工具进行使用的所以会有上传下载这样的需求： 我遇到的问题： sz下载A文件10M左右，没有问题 但是将这个文件A再传到另一天服务器上时就出现传不上去，甚至出现乱码，死掉现象，具体问题 解决方法： 上传命令改为;rz -ybe 下载命令改为：sz -be filename 如果还是有问题： 那就是文
  • 通过ngx-lua来统计nginx上的虚拟主机性能数据 ronin47 ngx-lua　统计 解禁ip
    介绍 以前我们为nginx做统计,都是通过对日志的分析来完成.比较麻烦,现在基于ngx_lua插件,开发了实时统计站点状态的脚本,解放生产力.项目主页: https://github.com/skyeydemon/ngx-lua-stats 功能 支持分不同虚拟主机统计, 同一个虚拟主机下可以分不同的location统计. 可以统计与query-times request-time
  • java-68-把数组排成最小的数。一个正整数数组，将它们连接起来排成一个数，输出能排出的所有数字中最小的。例如输入数组{32, 321}，则输出32132 bylijinnan java
    import java.util.Arrays; import java.util.Comparator; public class MinNumFromIntArray { /** * Q68输入一个正整数数组，将它们连接起来排成一个数，输出能排出的所有数字中最小的一个。 * 例如输入数组{32, 321}，则输出这两个能排成的最小数字32132。请给出解决问题
  • Oracle基本操作 ccii Oracle SQL总结Oracle SQL语法Oracle基本操作Oracle SQL
    一、表操作 1. 常用数据类型 NUMBER(p,s)：可变长度的数字。p表示整数加小数的最大位数，s为最大小数位数。支持最大精度为38位 NVARCHAR2(size)：变长字符串，最大长度为4000字节（以字符数为单位） VARCHAR2(size)：变长字符串，最大长度为4000字节（以字节数为单位） CHAR(size)：定长字符串，最大长度为2000字节，最小为1字节，默认
  • [强人工智能]实现强人工智能的路线图 comsci 人工智能
        1：创建一个用于记录拓扑网络连接的矩阵数据表      2:自动构造或者人工复制一个包含10万个连接(1000*1000)的流程图      3：将这个流程图导入到矩阵数据表中      4：在矩阵的每个有意义的节点中嵌入一段简单的
  • 给Tomcat，Apache配置gzip压缩(HTTP压缩)功能 cwqcwqmax9 apache
    背景： HTTP 压缩可以大大提高浏览网站的速度，它的原理是，在客户端请求网页后，从服务器端将网页文件压缩，再下载到客户端，由客户端的浏览器负责解压缩并浏览。相对于普通的浏览过程HTML ,CSS,Javascript , Text ，它可以节省40%左右的流量。更为重要的是，它可以对动态生成的，包括CGI、PHP , JSP , ASP , Servlet,SHTML等输出的网页也能进行压缩，
  • SpringMVC and Struts2 dashuaifu struts2springMVC
    SpringMVC VS Struts2 1: spring3开发效率高于struts 2: spring3 mvc可以认为已经100%零配置 3: struts2是类级别的拦截， 一个类对应一个request上下文， springmvc是方法级别的拦截，一个方法对应一个request上下文，而方法同时又跟一个url对应 所以说从架构本身上 spring3 mvc就容易实现r
  • windows常用命令行命令 dcj3sjt126com windowscmdcommand
    在windows系统中，点击开始－运行，可以直接输入命令行，快速打开一些原本需要多次点击图标才能打开的界面，如常用的输入cmd打开dos命令行，输入taskmgr打开任务管理器。此处列出了网上搜集到的一些常用命令。winver 检查windows版本 wmimgmt.msc 打开windows管理体系结构(wmi) wupdmgr windows更新程序 wscrip
  • 再看知名应用背后的第三方开源项目 dcj3sjt126com ios
    知名应用程序的设计和技术一直都是开发者需要学习的，同样这些应用所使用的开源框架也是不可忽视的一部分。此前《 iOS第三方开源库的吐槽和备忘》中作者ibireme列举了国内多款知名应用所使用的开源框架，并对其中一些框架进行了分析，同样国外开发者 @iOSCowboy也在博客中给我们列出了国外多款知名应用使用的开源框架。另外txx's blog中详细介绍了 Facebook Paper使用的第三
  • Objective-c单例模式的正确写法 jsntghf 单例iosiPhone
    一般情况下，可能我们写的单例模式是这样的： #import <Foundation/Foundation.h> @interface Downloader : NSObject + (instancetype)sharedDownloader; @end #import "Downloader.h" @implementation
  • jquery easyui datagrid 加载成功，选中某一行 hae jqueryeasyuidatagrid数据加载
    1.首先你需要设置datagrid的onLoadSuccess $( '#dg' ).datagrid({onLoadSuccess :  function (data){      $( '#dg' ).datagrid( 'selectRow' ,3); }});   2.onL
  • jQuery用户数字打分评价效果 ini JavaScripthtmljqueryWebcss
    效果体验：http://hovertree.com/texiao/jquery/5.htmHTML文件代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery用户数字打分评分代码 - HoverTree</
  • mybatis的paramType kerryg DAOsql
    MyBatis传多个参数： 1、采用#{0},#{1}获得参数：    Dao层函数方法：     public User selectUser(String name,String area); 对应的Mapper.xml    <select id="selectUser" result
  • centos 7安装mysql5.5 MrLee23 centos
    首先centos7 已经不支持mysql，因为收费了你懂得，所以内部集成了mariadb，而安装mysql的话会和mariadb的文件冲突，所以需要先卸载掉mariadb，以下为卸载mariadb，安装mysql的步骤。   #列出所有被安装的rpm package rpm -qa | grep mariadb   #卸载 rpm -e mariadb-libs-5.
  • 利用thrift来实现消息群发 qifeifei thrift
               Thrift项目一般用来做内部项目接偶用的，还有能跨不同语言的功能，非常方便，一般前端系统和后台server线上都是3个节点，然后前端通过获取client来访问后台server，那么如果是多太server，就是有一个负载均衡的方法，然后最后访问其中一个节点。那么换个思路，能不能发送给所有节点的server呢，如果能就
  • 实现一个sizeof获取Java对象大小 teasp javaHotSpot内存对象大小sizeof
       由于Java的设计者不想让程序员管理和了解内存的使用，我们想要知道一个对象在内存中的大小变得比较困难了。本文提供了可以获取对象的大小的方法，但是由于各个虚拟机在内存使用上可能存在不同，因此该方法不能在各虚拟机上都适用，而是仅在hotspot 32位虚拟机上，或者其它内存管理方式与hotspot 32位虚拟机相同的虚拟机上 适用。     
  • SVN错误及处理 xiangqian0505 SVN提交文件时服务器强行关闭
    在SVN服务控制台打开资源库“SVN无法读取current” ---摘自网络 写道 SVN无法读取current修复方法 Can't read file : End of file found 文件：repository/db/txn_current、repository/db/current   其中current记录当前最新版本号，txn_current记录版本库中版本
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他