IE FlipH,FlipV滤镜

评论(0)浏览(90)分类:HTML/CSS兼容/XML
IE FlipH,FlipV滤镜  IE FlipH,FlipV滤镜:创建水平,垂直镜像语法filter:FlipVfilter:FlipHIE FlipH,FlipV滤镜示例,请在IE下运行stylebody{background:#ffffff}div{width:100px;height:100px;float:left;margin:0px 20px 20px 0px}.FlipH{filter:FlipH}.FlipV{filter:FlipV}/styledivFlipH,FlipV滤镜,原始效果/divdiv class=FlipH/作用于FlipH下的文字效果/di..

IE DropShadow滤镜

评论(0)浏览(165)分类:HTML/CSS兼容/XML
IE DropShadow滤镜  IE DropShadow滤镜:创建对象的固定影子语法filter:DropShadow(Color=color,OffX=offX,OffY=offY,Positive=positive) 说明 Color:#rrggbb格式,任意. Offx:X轴偏离值. Offy:Y轴偏离值. Positive:1或0.如果为TRUE(非0),就为任何的非透明像素建立可见的投影 如果为FASLE(0),就为透明的像素部分建立透明效果 例子:filter:DropShadow..

IE blur滤镜

评论(0)浏览(206)分类:HTML/CSS兼容/XML
IE blur滤镜  IE blur滤镜:创建高速度移动效果,即模糊效果语法filter:Blur(Add=add,Direction=direction,Strength=strength)说明 Add:是一个布尔值,一般来说,当滤镜用于图片时取0,用于文字时取1。文字设置add=1时会整个字体增加移动效果,会很模糊注意设置add的值。 Direction:模糊方向,以45度为单位改变,0为垂直向上,45向右上,90水平向右,13..

IE alpha滤镜

评论(0)浏览(134)分类:HTML/CSS兼容/XML
IE alpha滤镜  IE alpha滤镜:设置透明层次语法 filter:Alpha(Opacity=opacity,FinishOpacity=finishopacity,Style=style,StartX=startX,StartY=startY,FinishX=finishX,FinishY=finishY)说明opacity代表透明度水准。默认的范围是从0 到 100,他们其实是百分比的形式。也就是说,0代表完全透明,100代表完全不透明。finishopacity是一个可选参数,如果想要..

iframe嵌套图吧地图在线标点地图

评论(0)浏览(201)分类:HTML/CSS兼容/XML
iframe嵌套图吧地图在线标点地图  图吧地图在线标点地图在线生成地址:http://union.mapbar.com/onlineTagging.jsp,注册激活账户后生成地图标注界面如下  图吧在线标点地图需要注册才能生成iframe引用的地址,效果如下。  iframe引入的图吧在线标点地图效果

jquery mouseleave事件:移动到子容器select的option上也会触发

评论(0)浏览(615)分类:HTML/CSS兼容/XML
jquery mouseleave事件:移动到子容器select的option上也会触发  当使用jquery给父容器绑定了mouseleave事件时,只有离开了父容器对象才会触发mouseleave事件,移动到子对象容器是不会触发的【注意不要使用mouseout事件,要不即使移动到的是父容器的子对象,如a也会触发mouseout事件。】  但是今天碰到了一个特例,如果父容器中包含select对象,当展开select对象的option时,鼠标移动到option选项上,父容..

css控制英文字母的大小写

评论(0)浏览(733)分类:HTML/CSS兼容/XML
css控制英文字母的大小写  css如何控制英文字母的大小写style.uc{text-transform:uppercase;/*用此样式后英文字母都显示为大写*/}.lc{text-transform:lowercase;/*用此样式后英文字母都显示为小写*/}/stylediv class=ucall the english word in this div be changed to upper case/divbr /div class=lcall the english word in this div be changed to lower case/div

css样式表important优先级大于内联style设置的样式

评论(0)浏览(4473)分类:HTML/CSS兼容/XML
css样式表important优先级大于内联style设置的样式  今天发现css样式表中使用了important提高优先级后,尽然覆盖了内联样式style中设置的对应样式,老土了。。呵呵  测试代码如下style.c{color:Red !important}/stylediv class=c style=color:Blue内联style样式无法覆盖样式表中的important,内容显示为红色,而不是内联样式设置的蓝色/div  提高内联样式style的优先级也需要增加important..

IE7 xhtml模式下position:relative overflow失效

评论(0)浏览(206)分类:HTML/CSS兼容/XML
IE7 xhtml模式下position:relative overflow失效  IE7浏览器xhtml模式下,发现父容器设置了overflow:hidden/auto,子容器如果position为relative定位,父容器设置的overflow:hidden/auto失效,超出父容器的内容没有隐藏或者出现滚动条,而是直接显示出来,IE8+和其他浏览器如firefox没有问题。   IE8,显示正常IE7则内容直接显示,超出父容器范围  测试代码!DOCTYPE html PUBLIC -//..

button在IE下的表现形式当添加xhtml申明后

评论(0)浏览(176)分类:HTML/CSS兼容/XML
button在IE下的表现形式当添加xhtml申明后  在IE浏览器下,对于button标签,添加xhtml申明和为添加xhtml有很大区别。  IE下没加xhtml申明时button123/button==inputtype=button/,加了xhtml申明后button123/button==inputtype=submit/。  firefox和chrome等非IE核心的浏览器button123/button==inputtype=submit/。  测试代码,添加了xhtml申明,IE下会提交表单!DOCTYPE html PUB..

IE7- radio无法去掉内边距

评论(0)浏览(116)分类:HTML/CSS兼容/XML
IE7- radio无法去掉内边距  IE7-浏览器下,设置radio容器的margin和padding都为0都无法去掉圆点周围的补白内容,IE8和firefox浏览器可以去掉补白内容。  注:IE8需要添加xhtml申明为CSS1Compat才行。  最后只好用JS+图片来模拟radio选项,测试效果如下  获取焦点和没有焦点的2张radio图片:   源代码如下!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transiti..

css控制DOM对象旋转

评论(0)浏览(258)分类:HTML/CSS兼容/XML
css控制DOM对象旋转  css控制HTML DOM对象旋转任意角度,兼容IE,firefox,chrome等主流浏览器,效果如下  源代码如下!DOCTYPE htmlhtml lang=enheadmeta http-equiv=Content-Type content=text/html; charset=utf-8titleDIV旋转属性的演示/titlemeta http-equiv=X-UA-Compatible content=IE=EmulateIE8 /style type=text/css body {font-family: Arial, sans-..

IE下使用透明滤镜出现锯齿解决办法

评论(0)浏览(249)分类:HTML/CSS兼容/XML
IE下使用透明滤镜出现锯齿解决办法  IE浏览器下使用alpha透明滤镜时,文字或者图片边缘会出现锯齿,测试代码!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 content=text/html; charset=utf-8 /titleIE下使用透明滤镜出现锯齿..

IE6 float margin双倍增加

评论(0)浏览(90)分类:HTML/CSS兼容/XML
IE6 float margin双倍增加  IE6浏览器下面如果设置了margin,并且float为left时,则左边的margin,即margin-left会双倍增加body style=margin:0px;div style=margin:10px;float:left;border:solid 1px black;width:100px;height:100px;/div/body  解决办法就是增加display:inline即可解决ie6下的float:left左边浮动时margin-left双倍增加的问题。body style=margin:0..

DOCTYPE xhtml对body高度影响

评论(0)浏览(298)分类:HTML/CSS兼容/XML
DOCTYPE xhtml对body高度影响  xhtml申明css1compat模式下,body没有内容,IE,chrome下点击时无法响应事件,但是firefox会响应,即使document.body.clientHeight不为0,firefox的bug? !doctype htmltitlecss1compat模式下,body没有内容,IE,chrome下点击时无法响应事件,但是firefox会响应,即使document.body.clientHeight不为0,firefox的bug?。。/titlescript typ..

html5 ajax上传文件asp.net示例

评论(0)浏览(7166)分类:JavaScript/Ajax开发技巧
html5 ajax上传文件asp.net示例  在Gecko(firefox4+)和webkit(chrome)核心的浏览器中存在FormData对象,可以收集表单中的文件内容,结合ajax对象XMLHttpRequest就可以无刷新的上传文件了。FormData对象实例有一个方法叫做append,允许加入任何形式的数据(文本和文件)的对象。不过悲催的是IE9虽然支持html5,但是没有FormData对象。  测试代码html xmlns=http://www...

firefox/chrome动态设置script加载js文件失败

评论(0)浏览(730)分类:HTML/CSS兼容/XML
firefox/chrome动态设置script加载js文件失败  firefox,chrome等w3c浏览器下面,设置script标签的src来动态加载js文件时,有2中情况1)如果script标签已经加载过js文件,那么重新设置为其他js文件的路径时,无法加载这个js文件。2)如果未加载过js文件,是一个空的script标签,那么第一次设置src时可以加载这个js文件,第二次设置就没用办法加载指定的js文件了。  即使增加时间戳也不行..

淘宝广告主后台导航jQuery插件

评论(0)浏览(118)分类:HTML/CSS兼容/XML
淘宝广告主后台导航jQuery插件  淘宝广告主后台导航效果,用jQuery写的插件  配置说明fx:动画效果,默认linear,还可以设置为easein,easeout等。。具体看代码里面扩展的jQuery.easingspeed:动画时间,默认500msclick:点击导航后的回调函数,默认空函数  源代码如下!DOCTYPE HTML PUBliC -//W3C//DTD HTML 4.0 Transitional//ENhtmlheadtitle淘宝广告主后台导航jQue..

谷歌导航条jQuery插件

评论(0)浏览(73)分类:HTML/CSS兼容/XML
谷歌导航条jQuery插件  本站页头的谷歌导航条效果,使用了jQuery框架,源代码如下!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 content=text/html;charset=utf-8 /title谷歌导航条jQuery插件-编程设计网/title..

css控制文本反方向显示

评论(0)浏览(221)分类:HTML/CSS兼容/XML
css控制文本反方向显示  CSS属性:unicode-bidi 设置文本的方向,也就是将文字的方向倒过来。如123456,显示为654321  尽管 CSS 试图处理书写方向,但 Unicode 有一种更健壮的方式来处理方向性。利用属性 unicode-bidi,CSS 创作人员可以充分利用 Unicode 的某些功能。可能的值:normal,embed,bidi-override实现此效果的代码:span style=unicode-b..

javascript实现IE,firefox客户端图片预览

评论(0)浏览(269)分类:JavaScript/Ajax开发技巧
javascript实现IE,firefox客户端图片预览  javascript实现IE,firefox客户端图片预览,测试浏览器:IE6~8,firefox4.0。  google的chrome,safari,opera浏览器需要上传图片才行,这个不在讨论范围,上传后也变简单多了,将表单自动提交到隐藏iframe实现无刷新上传图片文件后,在服务器端保存图片然后返回路径,具体参考这篇文章:ajax无刷新上传文件,使用iframe模仿。  原理:由..

IE浏览器下获取file控件选择本地文件的路径

评论(0)浏览(2373)分类:JavaScript/Ajax开发技巧
IE浏览器下获取file控件选择本地文件的路径  由于安全问题,IE7+浏览器的internet区域的安全设置中将文件上传到服务器时包含本地目录路径选项默认是禁用的,所以通过file.value得到的不是实际选择的本地文件的路径,而是定位到c:\fjkk\等乱七八糟的路径去,文件名是正确的,路径不正确。  IE浏览器下面可以使用selection对象获取到真实的本地选择文件的路径,firefox需要设置安全性,..

ie margin top失效当前一个节点display为absolute

评论(0)浏览(218)分类:HTML/CSS兼容/XML
ie margin top失效当前一个节点display为absolute  在IE浏览器下面,某个节点设置了margin-top和height属性时,如果此节点的上一个兄弟节点的display为absolute,这个节点的margin-top会失效。去掉这个节点的height属性后,margin-top又起作用了。  解决办法1)将绝对定位的节点放到所有兄弟节点的最后,这样在display为absolute前面设置过height的兄弟节点的margin-top就不会失效了。2)给..

2个并排input在XHTML摸下下IE下输入中文导致offset增加bug

评论(1)浏览(434)分类:HTML/CSS兼容/XML
2个并排input在XHTML摸下下IE下输入中文导致offset增加bug  在IE浏览器下面,当文档申明为xhtml时,2个并排的在一起的输入控件,当一个输入框内容为非中文内容,另外一个为中文时,出现奇怪的问题。测试代码在最后1)IE8浏览器下面顶部会出现2px差距,没有对齐,并且输入框内的文字没有对齐,中文接近顶部,非中文内容和中文内容相差2px左右,如图一。图一2)IE7浏览器下面顶部对齐,但是输入框内的文..

Firefox下margin-top负值失效

评论(0)浏览(771)分类:HTML/CSS兼容/XML
Firefox下margin-top负值失效  在csdn看到一个问题:firefox浏览器下面,当设置一个容器内的子元素的margin-top为负值时,如果负值的绝对值超过容器的高度,结果不是完全隐藏了图片,而子元素会显示出margin-top设置的绝对值-容器高度这么多的内容。网上找了下据说是firefox特有的块级盒模型相邻的垂直margin会被折叠的问题。  测试代码如下,firefox和其他浏览器的表示..

javascript动态给图片添加热点

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

textarea设置下划线格式

评论(0)浏览(2986)分类:HTML/CSS兼容/XML
textarea设置下划线格式功能要求:1:如何实现在多行文本框textarea里面每一行下面都有一条横线 2:textarea文本框里面有一段不能删掉实现方法:横线用背景图片来做,不动的文字用浮动层+给textarea增加text-indent来实现缩进。源代码如下:style type=text/css.input{position:relative}.word{position:absolute;line-height:20px;left:0px;top:1px;z-index:10;backgr..

隐藏IE textarea控件滚动条

评论(0)浏览(198)分类:HTML/CSS兼容/XML
隐藏IE textarea控件滚动条  IE浏览器下面textarea即使没有内容,也会在右边显示一个灰色的滚动条,如下图所示  在IE下要隐藏textarea的滚动条,只需要增加style=overflow:hidden或者auto就可以隐藏灰色滚动条了。textarea rows=5 cols=50 style=overflow:auto/textarea

浮动层没有内容在IE下失效bug

评论(0)浏览(190)分类:HTML/CSS兼容/XML
浮动层没有内容在IE下失效bug  问题描述:在IE浏览器下,浮动层如果没有内容或者未设置过背景之类,当这个层浮动在正常内容的上面时,添加到浮动层上面的事件,如 click,mouseover等事件,当触发点在有正常内容的部分,不会响应事件,只有在没有内容的部分才会响应事件。其他浏览器如 firefox,chrome不会出现这种问题。  通过IE的开发人员工具得到下图  点击蓝色框框..

图片显示十字交叉线,随鼠标移动效果

评论(0)浏览(296)分类:JavaScript/Ajax开发技巧
图片显示十字交叉线,随鼠标移动效果  功能描述:显示十字线在图片上,十字线交叉中心为鼠标所在位置,十字线随鼠标移动而更改位置  查看效果点击这里  源代码如下style type=text/css#dv{position:relative;}#linex{height:1px;width:300px;position:absolute;left:0px;background:#000;overflow:hidden;display:none;}#liney{height:300px;width:1px;position:absolute;top..