css3动画transform使用详解

评论(0)浏览(313)分类:HTML/CSS兼容/XML
css3动画transform使用详解  Transform字面上就是变形,改变的意思。在CSS3中transform主要包括以下几种:旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix。下面我们一起来看看CSS3中transform的旋转rotate、扭曲skew、缩放scale和移动translate具体如何实现,老样子,我们就从transform的语法开始吧。语法: transform : none | transform-funct..

通过@media screen控制网站在移动端显示

评论(0)浏览(1025)分类:HTML/CSS兼容/XML
通过@media screen控制网站在移动端显示  今天下午花点时间将本站css进行修改,通过@media screen max-width/min-width将本站在移动端浏览器下显示得更加友好。  本站在分辨率宽度680px一下显示如下  如果您在电脑端浏览本站使用的标准浏览器(IE9+,firefox,chrome等),可以缩小浏览器窗口大小到680px以下可以看到效果。  利用@media screen实现网页..

javascript加载xml文件

评论(0)浏览(794)分类:JavaScript/Ajax开发技巧
javascript加载xml文件  javascript加载xml文件源代码 /* 通过ajax加载xml文件,返回xml dom对象 备注:chrome浏览器下请求本地xml文件会报XMLHttpRequest cannot load file:///xxxxx.xx. Cross origin requests are only supported for HTTP,需要搭建服务器 */ function LoadXML(url) { var xhr = window.ActiveXObject ? new ActiveXObject..

解决uploadify cancel取消上传再选择文件报超过限制错误

评论(0)浏览(1229)分类:JavaScript/Ajax开发技巧
解决uploadify cancel取消上传再选择文件报超过限制错误  调用uploadify的cancel方法后,如果再选择文件,超出uploadLimit配置值会报错。看源代码后,uploadify调用cancel方法只有清空队列的情况下(传递*参数,$(xxx).uploadify(cancel,*))才会重置上传队列的值,对于取消单个文件或者指定了多个要取消的队列id参数,没有重置队列长度,继续包含被取消上传的文件数量。所以继续选择文件就会报超过队..

选中网页内容弹出按钮点击发送选中内容到服务器

评论(1)浏览(349)分类:JavaScript/Ajax开发技巧
选中网页内容弹出按钮点击发送选中内容到服务器  效果:在网页中选中一段内容后,自动弹出一个按钮,点击按钮可以将选中的内容回发到服务器。  实现方法:用javascript添加document.onmouseup事件,用range API判断是否选中内容,选中内容则弹出按钮,给按钮绑定点击事件,点击后将选中的内容使用ajax发送到服务器端。  选中网页内容弹出按钮点击发送选中内容到服务器源代码如下script ..

访问输出为空ashx文件firefox弹出保存文件对话框

评论(0)浏览(343)分类:JavaScript/Ajax开发技巧
访问输出为空ashx文件firefox弹出保存文件对话框  用firefox浏览器访问空的ashx文件时,会弹出保存ashx文件的对话框,正在打开ashx。  用开发工具监视后发现响应头尽然没有content-type类型,而且用代码强制设置content-type也无效,还是没有content-type响应头。 public void ProcessRequest(HttpContext context) { context.Response.AddHeader(content-type, text/html);/..

修改input file控件默认浏览文字

评论(0)浏览(1347)分类:HTML/CSS兼容/XML
修改input file控件默认浏览文字  如何修改html input file控件默认的浏览(firefox和ie)或者选择文件(chrome)显示内容。解决办法:用一个透明的file控件浮动到你的自己的提示文字或者图片上即可。注意:IE下必须要调整默认的按钮位置对到你的文字上,前面显示文件路径的那部分覆盖住提示文字需要双击才能弹出文件选择窗口。自己调整input的font-size属性变换file控件大小..

javascript动态添加ajaxtookit tabcontainer tabpanel示例

评论(0)浏览(277)分类:JavaScript/Ajax开发技巧
javascript动态添加ajaxtookit tabcontainer tabpanel示例  在浏览器控制台打印ajaxtookit tabcontainer对象时,发现ajaxtookit tabcontainer客户端类库没有提供客户端API给js调用动态添加tabpanel,需要在asp.net服务器端TabContainer1.Tabs.Add动态添加。  javascript动态添加ajaxtookit tabcontainer tabpanel示例如下,需要自己写代码,动态添加tabpanel。%@ Page Language=C# AutoEventWireup=..

chrome An invalid form control with name is not focusable.

评论(0)浏览(1461)分类:JavaScript/Ajax开发技巧
chrome An invalid form control with name is not focusable.   提交表单时chrome控制台出现错误:An invalid form control with name is not focusable.  出现这个错误是因为表单中包含了HTML5属性required的控件不可见(如这个控件style display设置为none或者其父容器display为none),被隐藏起来了,导致chrome无法聚焦这个值为空的输入项弹出错误提示窗口而报错:An invalid form control with nam..

IE透明滤镜alpha失效解决办法

评论(0)浏览(274)分类:HTML/CSS兼容/XML
IE透明滤镜alpha失效解决办法  IE的透明滤镜filter:alpha(opacity=40)在未添加xhtml申明时会不起效果。即使添加了xhtml申明,IE7也无效。IE7下xhtml申明alpha滤镜无效IE8无xhtml申明也无效源代码如下!DOCTYPE htmltitleIE透明滤镜alpha失效/titlestyle#dvTable div.opc4{opacity:0.4;filter:alpha(opacity=40);}#dvTable div.opc4:hover{opacity:1;filter:alpha(opacity=1..

ext gridpanel数据导出excel文件

评论(0)浏览(385)分类:extjs开发技巧
ext gridpanel数据导出excel文件  ext gridpanel导出excel文件类库代码,支持base64客户端数据直接导出。base64类库需要自己导入:javascript base64编码解码类库 var extToExcel = {//ext gridpanel导出excel文件类库代码 exportResult: function () { var fileName = this.title; var vExportContent = this.getExcelXml(); //..

javascript base64编码解码类库

评论(0)浏览(835)分类:JavaScript/Ajax开发技巧
javascript base64编码解码类库  javascript将字符串转为base64编码和解码base64字符串类库代码。script var Base64 = { // private property _keyStr: ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=, // public method for encoding encode: function (input) { var output = ; ..

input输入内容回车生成标签代码

评论(0)浏览(341)分类:JavaScript/Ajax开发技巧
input输入内容回车生成标签代码  在input文本框中输入标签内容后,回车创建标准效果。style#tag a{margin-right:10px;color:blue;border:dotted 1px blue;cursor:pointer}/stylespan id=tag/spaninput type=text onkeydown=addTag(event,this) /script type=text/javascript function addTag(e, o) { if (e.keyCode == 13 o.value != '') { v..

javascript依据月份生产日历

评论(0)浏览(101)分类:JavaScript/Ajax开发技巧
javascript依据月份生产日历  javascript依据输入的年份和月份生成日历对象。源代码如下titlejavascript依据月份生产日历/titleinput type=text onblur=renderCalendar(this.value)/div id=dv/divscriptfunction renderCalendar(v){ if(/^\d{4}-\d{1,2}$/.test(v)){ var d=new Date(v.replace(/-/,'/')+'/1'),s='table border=1trtd星期日/tdt..

websocket获取图片2进制数据流显示

评论(0)浏览(843)分类:JavaScript/Ajax开发技巧
websocket获取图片2进制数据流显示  javascript从websocket返回的2进制流中获取数据显示到img对象中。ws.onmessage = function(evt) { if(typeof(evt.data)==string){ //textHandler(JSON.parse(evt.data)); }else{ var reader = new FileReader(); reader.onload = function(evt){ if(evt.target.readyState == FileReader.DONE)..

javascript btoa/atob方法

评论(0)浏览(913)分类:JavaScript/Ajax开发技巧
javascript btoa/atob方法SummaryCreates a base-64 encoded ASCII string from a string of binary data.Please note that this is not suitable for rawUnicodestrings! See Unicode section below. Syntaxvar encodedData = window.btoa(stringToEncode); Examplevar encodedData = window.btoa(Hello, world); // encode a stringvar decodedData = window.atob(enco..

bootstrap datetimepicker控制可选时间区域

评论(0)浏览(466)分类:JavaScript/Ajax开发技巧
bootstrap datetimepicker控制可选时间区域  bootstrap datetimepicker插件如何控制可选择的时间区域,bootstrap datetimepicker插件如何禁用不用选时间区域。  解决办法:给bootstrap datetimepicker添加changeDate事件,获取选择的小时数据部分增加判断,不符合选择的时间区域清空选中的值。  bootstrap datetimepicker控制可选时间区域源代码如如下,只能选择8~21点之间的时间$(..

Ext formpanel loadRecord/load方法示例

评论(0)浏览(938)分类:extjs开发技巧
Ext formpanel loadRecord/load方法示例  Ext formpanel loadRecord/load方法给formpanel加载数据示例  Ext formpanel loadRecord是加载本地数据用的,注意参数一定要是Ext.data.Record(3-版本)或者Ext.data.Model(4+版本)实例对象,不能直接加载JSON对象。  Ext formpanel load是加载远程数据用的,返回的数据格式如下,success为ture表示请求成功,数据放到data键名称下注..

网页F11 canvas全屏显示

评论(0)浏览(248)分类:JavaScript/Ajax开发技巧
网页F11 canvas全屏显示  如何让canvas对象全屏显示,在网页中按下F11键时canvas对象全屏显示。  网页F11 canvas全屏显示源代码如下titlecanvas F11全屏显示示例/titlecanvas id=c stlyle=border:solid 1px #000/canvasscript var c = document.getElementById('c'); if (c.getContext) { document.onkeydown = function (e) { if..

让IE8-浏览器支持html5 placeholder属性,支持password类型

评论(0)浏览(2663)分类:JavaScript/Ajax开发技巧
让IE8-浏览器支持html5 placeholder属性,支持password类型  placeholder是html5的属性,可以在文本框内显示提示内容,而这个提示内容确不会提交到服务器。IE8-不支持html5,所以需要使用js来实现placeholder效果。  本示例居于jquery框架,让IE8-浏览器支持html5 placeholder属性,支持password类型源代码如下script type=text/javascript src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2...

js控制移动浏览器输入框获取焦点隐藏不弹出系统软键盘

评论(0)浏览(1465)分类:JavaScript/Ajax开发技巧
js控制移动浏览器输入框获取焦点隐藏不弹出系统软键盘  使用移动端浏览器看网页时,输入对象获取焦掉后会自动弹出系统的软键盘,导致页面显示区域变小,如何禁止输入对象input获取焦点后的系统软键盘。  js控制移动浏览器输入框获取焦点隐藏不弹出系统软键盘源代码如下input type=text id=phone-number onfocus=blur(); /  意思就是获取焦点后马上取消焦点,这样软键盘就会自动隐藏了。下面是..

easyui datagrid fitColumns:true失效解决办法

评论(0)浏览(13257)分类:easyui开发技巧
easyui datagrid fitColumns:true失效解决办法  easyui datagrid fitColumns配置设置为true时,但是数据列并没有自动填充满datagrid指定的宽度,出现这个问题,是因为你的所有列配置都没有指定width属性,导致datagrid不会重新计算列宽度,所以列宽取列标题宽度或者此列内容宽度的最大值。  datagrid fitColumns配置为true后,是依据配置列width,和datagrid的指定width来重新结算此列的..

让IE6,IE7支持display inline-block

评论(0)浏览(186)分类:HTML/CSS兼容/XML
让IE6,IE7支持display inline-block  IE6,IE7对css样式display inline-block的支持有问题,需要经过css hack后才会支持。注意:IE8需要加xhtml申明变为css1compat模式才会支持inline-block,backcompat模式不支持,但是可以通过css hack来实现,和IE7-一样。  要想让IE6,IE7支持css样式display inline-block,有下面2种方法1、先使用display:inline-block属性触发块元素,然后..

DOM对象旋转插件jquery.rotate.js

评论(0)浏览(1314)分类:JavaScript/Ajax开发技巧
DOM对象旋转插件jquery.rotate.js  jQuery 插件jquery.rotate.js,可以实现DOM对象旋转效果。jquery.rotate.js支持所有主流浏览器,包括 IE6。如果你想在低版本的 IE 中实现旋转效果,那么jquery.rotate.js是一个很好的选择。jquery.rotate.js参数参数类型说明默认值angle数字旋转一个角度0animateTo数字从当前的角度旋转到多少度0step函数每个动画步骤中执行的回调函数,当前..

全屏内容切换插件jQuery.fullPage.js

评论(0)浏览(379)分类:JavaScript/Ajax开发技巧
全屏内容切换插件jQuery.fullPage.jsfullPage.js 是一个基于 jQuery 的插件,它能够很方便、很轻松的制作出全屏网站,多个章节进行切换显示,fullPage.js主要功能有:支持鼠标滚动切换支持前进后退和键盘控制切换多个回调函数支持手机、平板触摸事件支持 CSS3 动画支持窗口缩放窗口缩放时自动调整可设置滚动宽度、背景颜色、滚动速度、循环选项、回调、文本对齐方式等等兼容性jQuer..

JavaScript记录表单用户名和密码

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

fckeditor加载完毕事件FCKeditor_OnComplete

评论(0)浏览(295)分类:JavaScript/Ajax开发技巧
fckeditor加载完毕事件FCKeditor_OnComplete  fckeditor编辑器是iframe形式的,如果判断fckeditor的编辑器区域是否加载完毕。即使放在window.onload中执行fckeditor的编辑器区域的初始化操作,也会出现无法找到fckeditor编辑器body对象。 varr fck = new FCKeditor('fck'); fck.BasePath = '/fckeditor/'; fck.Height = 450; fck.Value = 'fckeditor内容..

js检查浏览器是否支持html5

评论(0)浏览(131)分类:JavaScript/Ajax开发技巧
js检查浏览器是否支持html5  浏览器是否支持HTML5功能,可以使用下面4种方法进行检查。js检测全局对象上HTML5属性js在创建的HTML5元素上检测属性js检测HTML5元素一个方法是否返回期望值js检测HTML5元素是否能保留值1,js检测全局对象上HTML5属性:比如,检测离线功能的代码。!doctype htmlhtml lang=cnhead meta charset=UTF-8 titleapplicationCache Test/title ..

img hspace/vspace失效解决办法

评论(0)浏览(927)分类:HTML/CSS兼容/XML
img hspace/vspace失效解决办法  html img标签添加了hspace,vspace属性后确没有作用,图片紧靠文字解决办法。  img标签添加了hspace,vspace属性后确没起作用,一般是样式中定义了img,设置了margin导致的,如下,上图的图片添加了hspace为10,但是文字还是紧靠图片,查看图片样式后发下有如下的css设置过img的margin为0。  将这个样式中的img去掉后,img设置hspace,v..

javascript使用canvas压缩图像

评论(1)浏览(1001)分类:JavaScript/Ajax开发技巧
javascript使用canvas压缩图像  javascript使用HTML5 canvas对象,在客户端压缩图片后上传到服务器。ajax发送canvas压缩后的base64图片字符串内容到服务器,服务器将base64内容转为2进制数据保存为图片即可。  效果如下,左边是原始图片,右边是压缩后的。javascript使用canvas压缩图像源代码如下!DOCTYPE htmlhtmlheadmeta charset=utf-8/titlejavascript使用canvas压缩..