拖拽,按等比例放大,缩小,任意修改图片大小

评论(1)浏览(382)分类:JavaScript/Ajax开发技巧
拖拽,按等比例放大,缩小,任意修改图片大小  在页面上实现图片拖拽并可以随意调整图片大小。 但如果按住Ctrl键之后,当再调整图片大小的时候需要按照比例进行调整。  示例效果点击这里查看+展开-HTMLhtmlheadmetahttp-equiv="content-type"content="text/html;charset=gb2312;"/title拖拽,按等比例放大,缩小,任意修改图片大小/titlemetaname="Keywords"content="图片拖拽,图片扥等..

JavaScript记录表单用户名和密码

评论(0)浏览(380)分类:JavaScript/Ajax开发技巧
JavaScript记录表单用户名和密码  用javascript记录用户输入的用户名和密码功能示例代码,这样用户下次访问页面时,不需要输入用户名和密码,可以直接提交表单验证用户登录信息。  javascript记录用户输入的用户名和密码的实现原理,就是用cookie记录住用户名和密码即可。示例代码如下titleJavaScript记录表单用户名和密码/titleform method=get onsubmit=return check(thi..

javascript replace函数$&

评论(0)浏览(379)分类:JavaScript/Ajax开发技巧
javascript replace函数$&  今天发现自己写的高亮函数代码出现问题,有一些内容没有替换掉,显示为原来的内容,认真看了一下replace函数,发现自己完全没理解透replace函数中替换内容特殊字符$的用途,导致代码出现bug。  原来的代码要替换__JS0__这个内容为nbsp;$nbsp;,执行替换后发现不是nbsp;$nbsp;,而是变成了nbsp;__JS0__nbsp;,原因是$代表的是与 regexp 相匹..

单选和多选集成的jquery combobox插件

评论(0)浏览(379)分类:JavaScript/Ajax开发技巧
单选和多选集成的jquery combobox插件  单选和多选集成的jquery combobox插件,下拉选项中既有单选又有多选输入框,具体使用看示例和说明,效果如下title单选和多选集成的jquery combobox插件/titlescript type=text/javascript src=http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js/scriptstyle.pop{position:absolute;border:solid 1px black;display:none;pad..

javascript通过鼠标拖拽修改图片大小和位置

评论(0)浏览(378)分类:JavaScript/Ajax开发技巧
javascript通过鼠标拖拽修改图片大小和位置  javascript实现图片的拖拽移动,给图片添加锚点,放到锚点上出现resize鼠标形状,按下鼠标拖拽更改图片大小,效果如下  源代码如下!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdhtml xmlns=http://www.w3.org/1999/xhtmlheadmeta http-equiv=Content-Type conte..

javascript获取查询参数键值对

评论(0)浏览(375)分类:JavaScript/Ajax开发技巧
javascript获取查询参数键值对  javascript将get提交的查询参数对初始化为hashtable。  注意:下面的代码中键名称只能是数字和字母的组合,如果不是数字和字母注意修改正正则表达式。+展开-JavaScriptvars=location.search;//查询参数字符串varRequest={};//初始化Request对象functionInitRequest(){varm,reg=/([a-z\d]+)=([^&]+)/gi;s=s==''?'':s.substring(1);while(m=..

extjs判断gridpanel是否滚动到底部

评论(0)浏览(374)分类:extjs开发技巧
extjs判断gridpanel是否滚动到底部  extjs判断gridpanel是否滚动到底部,思路就是获取extjs gridpanel的数据容器,添加scroll事件,判断数据容器的scrollTop+offsetHeight=scrollHeight时就到底了。  本实例居于ext-4.1.1a,其他版本自己检查api(主要3-以下版本)兼容性,示例居于ext-4.1.1a/examples/grid/array-grid.html修改 var grid = Ext.create('Ext.grid.Panel..

JavaScript调用百度地图显示驾车,步行导航示例

评论(0)浏览(374)分类:JavaScript/Ajax开发技巧
JavaScript调用百度地图显示驾车,步行导航示例  JavaScript调用百度地图显示驾车,步行导航示例JavaScript调用百度地图显示驾车,步行导航示例源代码如下htmlhead meta http-equiv=Content-Type content=text/html; charset=utf-8 / meta name=viewport content=initial-scale=1.0, user-scalable=no / style type=text/cssbody, html {width: 100%;height: 100%; margin:0;font-f..

vs2013编译cordova build.bat: Command failed with exit code 8

评论(0)浏览(373)分类:phonegap/cordova
vs2013编译cordova build.bat: Command failed with exit code 8  vs2013编译cordova时,出现错误Command failed with exit code 81 GeneratedJavascript=1 E:\cordova\MyAppcall F:\Program Files\nodejs\\nodevars.bat1 Your environment has been set up for using Node.js 0.10.33 (ia32) and npm.1 ------ Ensuring correct global installation of package from source package directory: F:\PROGRAM..

canvas的translate、scale、rotate方法介绍

评论(0)浏览(372)分类:HTML/CSS兼容/XML
canvas的translate、scale、rotate方法介绍1.translate(x,y):平移,将画布的坐标原点向左右方向移动x,向上下方向移动y.canvas的默认位置是在(0,0). 例子:画布原点假如落在(1,1),那么translate(10,10)就是在原点(1,1)基础上分别在x轴、y轴移动10,则原点变为(11,11)。2.scale(x,y):扩大。x为水平方向的放大倍数,y为竖直方向的放大倍数。3.rotate(angel):旋转.angle指旋..

精简版jquery lazyload实现真正的延时图片加载

评论(0)浏览(372)分类:JavaScript/Ajax开发技巧
精简版jquery lazyload实现真正的延时图片加载  本次修改基于jquery.lazyload.js 1.5版本,删除了一些配置项,只保留了effect和placeholder配置,并且指定容器为window。  使用注意事项1)要实现真正的延时加载,将图片的src设置为默认的替换图片,实际的图片地址存储到自定义属性original如img src='替换的图片地址,1px_1px' original='实际图片地址'/2)如果没有按照..

FireFox下端口不一致导致跨域

评论(0)浏览(371)分类:JavaScript/Ajax开发技巧
FireFox下端口不一致导致跨域  在Firefox下,如果url路径带有端口号,而ajax对象访问的路径为绝对路径并且端口号不一样时,会出现uncaught exception: (1? XMLHttpRequest.open ?CP 3的错误,这个是因为端口号不一致时导致出现的跨域错误。而IE下不会因为请求的端口号不一致出现跨域的问题。  其实出现端口号不一致的错误实在是微乎其微,有谁会一个网站开放两个端口号..

js获取容器innerHTML得到输入控件值

评论(0)浏览(370)分类:JavaScript/Ajax开发技巧
js获取容器innerHTML得到输入控件值  如果输入控件放在容器里面,当然输入控件输入值后,获取容器的innerHTML时,标准浏览器如firefox,chrome时,innerHTML中input的html代码value属性是没有的,也没有包含输入的值。同理checkbox,radio,textarea也没有对应的值和checked属性,示例代码如下script src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js/scriptdiv ..

js判断已经滚动到页面底部

评论(0)浏览(368)分类:JavaScript/Ajax开发技巧
js判断已经滚动到页面底部  js如何判断页面已经滚动到底部!DOCTYPE htmlhtmlhead meta charset=UTF-8 titlejs判断已经滚动到页面底部/title/headbody style=margin:0;padding:0 div id=dvBT style=position:fixed;bottom:0;right:0;background:#fff/div div id=part1 style=height:2000px;overflow: auto;background: lightblue; /div div id=part2 ..

修改kindeditor编辑器默认显示行高

评论(0)浏览(368)分类:JavaScript/Ajax开发技巧
修改kindeditor编辑器默认显示行高  如何修改kindeditor编辑器显示框里面内容的默认行高。  通过上图知道kindeditor编辑器的输入容器(body)有ke-content样式,但是编辑器iframe并没有定义ke-content样式,所以只需要加上ke-content样式定义下line-height就行了。  记事本打开kindeditor-min.js或者kindeditor-all-min.js,如果导入的未压缩的自己记事本打开对应的js文件即..

JavaScript apply与call的用法意义及区别

评论(0)浏览(367)分类:JavaScript/Ajax开发技巧
JavaScript apply与call的用法意义及区别JavaScript中有一个call和apply方法,其作用基本相同,但也有略微的区别。先来看看JS手册中对call的解释:call 方法调用一个对象的一个方法,以另一个对象替换当前对象。call([thisObj[,arg1[, arg2[, [,.argN]]]]])参数thisObj可选项。将被用作当前对象的对象。arg1, arg2,, argN可选项。将被传递方法参数序列。说明call 方法可以用来代替另一个..

如何实现上传拖拽进入浏览器的文件

评论(0)浏览(366)分类:HTML/CSS兼容/XML
如何实现上传拖拽进入浏览器的文件  通过HTML5的文件API ,Firefox、Chrome等浏览器已经支持从操作系统直接拖拽文件进入浏览器,并上传到服务器。  让我们看一下Firefox 是如何使用拖拽上传功能的:  1)首先提供一个区域来放置文件div name=image id=dropbox style=min-width:300px;min-height:100px;border:3px dashed silver;/div2)然后监听拖拽过程中的dragenter、d..

javascript计算器

评论(0)浏览(365)分类:JavaScript/Ajax开发技巧
javascript计算器  JavaScript实现的简单计算器功能,界面如下  javascript计算器源代码如下script type=text/javascript src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js/scriptstyle #calc{padding:10px;background:#f1f1f1;width:201px} #display{border:solid 1px #ccc;margin-bottom:5px;padding:5px} #up,#down{height:20px;..

canvas对象drawImage方法

评论(0)浏览(363)分类:HTML/CSS兼容/XML
canvas对象drawImage方法  canvas对象drawImage方法是canvas导入图片的一种方法,他有三种重载形式:drawImage(image,x,y)drawImage(image,x,y,width,height):伸缩drawImage(image,sourceX,sourceY,sourceWidth,sourceHeight,destX,destY,destWidth,destHeight):剪切伸缩  其中第一个参数image可以是page中的img元素,也可以是其他canvas元素,base64编码的URL或vide..

多张图片热点如何添加

评论(0)浏览(362)分类:HTML/CSS兼容/XML
多张图片热点如何添加  由于图片的热点一般都是写死在HTML源代码里面了,所以如果有多张独立的图片需要增加热点,而且需要根据条件显示或者隐藏其中的某些图片时,这样图 片的位置就会发生变动,从而导致添加的热点对不上原图片的位置而导致失效或者乱套了。下面为1张图片拆分成4张进行热点操作。  实现要点:图片要有position为relative的容器,添加的热点就会变..

jquery焦点图代码,幻灯过渡特效,仿IE特效滤镜

评论(1)浏览(362)分类:JavaScript/Ajax开发技巧
jquery焦点图代码,幻灯过渡特效,仿IE特效滤镜  一款居于jquery框架的焦点图插件,有幻灯片过渡效果,模拟IE滤镜,完全兼容firefox,chrome浏览器,不需要使用IE下的滤镜。原理依据spw/sph的配置,在容器上生成spw*sph个块(宽和高依据容器计算得出),这些块的背景设置为下一张要显示的图片,依靠background-position控制每个块显示下一张图片的某个区域,让这些块组合起来显示为下一张图..

FCKEditor换行br后的全角或者半角空格丢失解决办法

评论(0)浏览(362)分类:JavaScript/Ajax开发技巧
FCKEditor换行br后的全角或者半角空格丢失解决办法  今天使用FCKEditor编辑器时,从记事本中复制内容到FCKEditor编辑器中,然后在开始的文字前面打入2个全角的空格进行缩进,提交后发现除了第一个段落的全角空格保存之外,其他的段落的全角空格全部没有了。  经测试后发现,FCKEditor在W3C浏览器,如firefox,chrome,紧跟在br/换行后的全角或者半角空格在提交的时候,不知道被FCKEditor给做..

svg+js+path直线的拖动与缩放

评论(0)浏览(360)分类:Canvas/VML/SVG
svg+js+path直线的拖动与缩放svg width="800" height="800" script![CDATA[ var SVGDocument = null; var SVGRoot = null; var TrueCoords = null; var Point = null; var BackDrop = null; var DragTarget = null; var dArray = new Array(12);//定义path d属性的数组 var dragger = null; var x; //当前鼠标(坐标) var y; var X1;//起点坐标 var Y1; var XL1;//path L..

css控制不允许操作iframe内容

评论(0)浏览(359)分类:HTML/CSS兼容/XML
css控制不允许操作iframe内容  css如何禁止用户操作iframe的内容(iframe加载的可能是跨域的页面),如选择iframe里面的内容。  解决办法就是用一个透明的层遮盖在iframe上方,这样就无法操作底层的iframe了。  测试代码如下!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdtitlecss控制不允许..

更正easyui datebox年月面板年份输入框bug

评论(0)浏览(359)分类:easyui开发技巧
更正easyui datebox年月面板年份输入框bug  bug1)easyui datebox年月面板年份输入框更改值并且失去焦点后,第一行显示的年份并不会更改,并且此时点击第一行的年份切换切换或者年份输入框同一行的年份切换按钮,会被还原为第一行的年份值+/-1。  bug2)easyui datebox点击年月面板第一行的月份切换按钮,如果换年后(往前或者往后都一样),年份输入框的年份值不会更改。如下图所示..

·在html页面中显示乱码解决办法

评论(0)浏览(358)分类:HTML/CSS兼容/XML
·在html页面中显示乱码解决办法  今天修改一个客户网站,发现中文符号点,就是键盘上Esc键下那个中文点号,在一些系统的浏览器上显示一个框框,为乱码,但是在本人电脑上却可以正常显示为中文点号,其他电脑也正常显示,就公司里面有2台电脑是这个问题(这2台电脑其他浏览器打开也是一个框框乱码,如下图所示)。  检查后发现这些内容字体为Microsoft Yahei,Arial,Helveti..

javascript设计模式1

评论(0)浏览(358)分类:JavaScript/Ajax开发技巧
javascript设计模式1  设计模式,不得不先重点着墨于“接口设计”,因为接口设计在设计模式中的意义太大了,大于模式本身。直观起见,先介绍一下接口定义的形式:+展开-JavaScriptvarinterface=newInterface("interface",[["getName",1],["getAge",1]]);  可以看出接口函数必须包含两个参数,接口方法定义在一个二维数组中。上例中定义了两个接口方法:getName,..

12.3.插入特殊的空格字符

评论(0)浏览(357)分类:flash/flex/fcs/AIR
12.3.插入特殊的空格字符问题我想在字符串中添加空格字符,比如制表符或新行字符解决办法使用特殊字符的转义序列讨论下面的表格列出了五种空格字符的转义字符。可以在字符串里用这些转义序列,这在文本框中显示文本是很有用的:+展开-ActionScriptvarexample:String="these\twords\tare\tseparated\tby\ttabs";//结果为:thesewordsareseparatedbytabs空格字符 ..

Selection.rangeCount属性

评论(0)浏览(355)分类:JavaScript/Ajax开发技巧
Selection.rangeCount属性Selection.rangeCount简介返回selection中range对象个数使用语法sel.rangeCount备注在用户点击一个新加载的页面前,rangeCount为0。用户可能一次只选择了一个range,所以rangeCount为1,一般也为1。但是通过脚本代码,可以让一个selection包含多个range。如Selection.addRange方法。来源:https://developer.mozilla.org/en-US/docs/Web/API/Sel..

Ext4 grid添加,删除,修改记录demo

评论(0)浏览(354)分类:extjs开发技巧
Ext4 grid添加,删除,修改记录demo  本示例只提供Ext4 grid添加,删除,修改记录demo前端javascript代码,自己参考代码Ext.data.Model编写动态页返回的json数据,如果修改过Ext.data.Model,记得修改返回的json结构。本示例接受的json数据结构{totalCount:2,success:true,data:[{Sno:Sno1, name:name1, password:password1, gender:gender1, humanId:humanId1, phone:phone..