12 2013 档案

摘要:近期在做一个Hot Fix,其中有个界面在IE6下超链接无法打开,经查是链接地址太长,2161个字节,已经超出ie6,7的长度限制,现把发现此问题的过程分享给大家。===过程=====1、万恶的ie6,连调试都没有好的工具,ietest又不靠谱。虽然现在业界都呼吁抛弃ie6,但我们的用户还在大量使用,没办法,还得解决此问题。2、点击超链接,没有任何反应,也没有任何js错误提示3、检查浏览器设置,勾上了"显示每个脚本错误的通知",去掉了"禁用脚本调试"4、再次点击,仍然没有任何错误提示,看来js代码没有错误了。也许有人会说,点击超链接怎么会有js错误,因为 阅读全文
posted @ 2013-12-31 13:49 Ranran 阅读(3059) 评论(0) 推荐(0) 编辑
摘要:1、效果及功能说明 图片滚动切换特效,高仿2012淘宝商城首页多格子焦点图切换,鼠标滑过焦点图片各个格子区域聚光灯效果展示 2、实现原理 在显示div的下面有一个按钮条在鼠标触及到按钮的时候会改变那妞的背景颜色作为辨识,后给按钮定义一个点击事件,让点击按钮后显示出相对应的图片,在没有点击的图片的情况下自动运行滚动的动画效果,每张图片的切换时间是3秒在点击按钮或者鼠标触及到图片上动画停止当鼠标移开后3秒后启动动画每个图片有可以链接到不同的地址在其中还给包含多个图片在一个div里显示出来他们不是一体的只是在一个块级容器里,最后给图片定义个伪类当鼠标触及到图片后会改变图片的背景颜色来让用户更好的辨认 阅读全文
posted @ 2013-12-31 06:39 Ranran 阅读(1124) 评论(0) 推荐(1) 编辑
摘要:最近对JQuery插件开发超级感兴趣,看到这样一篇好文章,可以说是《用实例一步步教你写Jquery插件》的十全大补,大家可以两篇结合着看看!jQuery插件的开发包括两种:一种是类级别的插件开发,即给jQuery添加新的全局函数,相当于给jQuery类本身添加方法。jQuery的全局函数就是属于jQuery命名空间的函数,另一种是对象级别的插件开发,即给jQuery对象添加方法。下面就两种函数的开发做详细的说明。1、类级别的插件开发类级别的插件开发最直接的理解就是给jQuery类添加类方法,可以理解为添加静态方法。典型的例子就是$.AJAX()这个函数,将函数定义于jQuery的命名空间中。关 阅读全文
posted @ 2013-12-30 08:38 Ranran 阅读(859) 评论(0) 推荐(2) 编辑
摘要:1.css font的简写规则 当我们写字体样式的时候,我们也许会这样子写 font-size: 1em; line-height: 1.5em; font-weight: bold; font-style: italic; font-variant: small-caps; font-family: verdana,serif 其实,这样写是完全多余的,我可以只用font 来写就OK了。 比如: font: 1em/1.5em bold italic small-caps verdana,serif 2.把几个class属性写在一... 阅读全文
posted @ 2013-12-28 11:54 Ranran 阅读(1001) 评论(1) 推荐(0) 编辑
摘要:1、效果及功能说明鼠标滑过悬停特效,div css制作产品列表图片布局通过鼠标滑过产品图片背景高亮闪烁显示,产品标题滑动显示或隐藏2、实现原理首先定义好一个重复实现效果的方法,然后定义光带出现速度和从什么位置出现,在定义当鼠标触及到图片后标题出什么位置出现到什么为位置停止,中间要花多少时间,最后在定义当鼠标离开图片后标题缩回去到那里和用的时间主要的方法$(this).find(".shine").css("background-position","-160px 0");//定义重复的动画效果$(this).find(".s 阅读全文
posted @ 2013-12-27 15:33 Ranran 阅读(1426) 评论(0) 推荐(0) 编辑
摘要:jQuery里提供了许多创建交互式网站的方法,在开发Web项目时,开发人员应该好好利用jQuery代码,它们不仅能给网站带来各种动画、特效,还会提高网站的用户体验。本文收集了10段非常实用的jQuery代码片段,你可以直接复制黏贴到代码里,但请开发者注意了,要理解代码再使用哦。下面就让我们一起来享受jQuery代码的魅力之处吧。1.预加载图片(function($) { var cache = []; // Arguments are image paths relative to the current page. $.preLoadImages = funct... 阅读全文
posted @ 2013-12-26 11:50 Ranran 阅读(1065) 评论(2) 推荐(1) 编辑
摘要:1、效果及功能说明 表格特效制作jquery表格可编辑任意修改里面的数值,是一种比较人性化的用户设计体验方式 2、实现原理 通过点击事件来触发跳出一个输入框可以在里面输入当这个输入框失去焦点后就把,所有值放到当前的input里面。 主要的方法 if(!$(this).is('.input')) //当点击了input后 $(this).addClass('input').html('').find('input').focus().blur(function() //点击以后跳出一个input类,在里面输入值,当失去焦点后把值都发 阅读全文
posted @ 2013-12-25 21:37 Ranran 阅读(2437) 评论(0) 推荐(1) 编辑
摘要:最近Web应用程序中越来越多地用到了JQuery等Web前端技术。这些技术框架有效地改善了用户的操作体验,同时也提高了开发人员构造丰富客户 端UI的效率。JQuery本身提供了丰富的操作,但是,有时候我们需要根据我们自己的业务和系统特色(风格)构造一些我们常用的前端UI组件,而 JQuery的插件给了我们一个较好的方式来构造这些UI组件,方便我们日后反复重用这些组件。网上也有很多关于JQuery插件的文章,我也搜了一些,但是,这些文档太过离散,没有有效地组织并充分说明JQuey插件该如何编写,并且有哪几种形式,什么情况下使用哪种形式。下面,我将说明JQuery插件常用的写法,以及这些插件的常用 阅读全文
posted @ 2013-12-24 22:07 Ranran 阅读(3129) 评论(4) 推荐(2) 编辑
摘要:IE5及其以后版本支持在CSS中使用expression,用来把CSS属性和Javas cript表达式关联起来,这里的CSS属性可以是元素固有的属性,也可以是自定义属性。就是说CSS属性后面可以是一段Javas cript表达式,CSS属性的值等于Javas cript表达式计算的结果。在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。 给元素固有属性赋值 例如,你可以依照浏览器的大小来安置一个元素的位置。以下是引用片段:#myDiv { position: absolute; width: 100px;... 阅读全文
posted @ 2013-12-24 16:11 Ranran 阅读(1037) 评论(1) 推荐(0) 编辑
摘要:1、效果及功能说明 animate动画分页按钮制作鼠标悬停分页按钮上滑动展开分页按钮,鼠标离开后分页按钮收缩 2、实现原理 主要是靠动画方法,来让原本的箭头图像的长度发生变长,正好可以融入下标题的文字大小,当鼠标离开以后就会让箭头图像触发另一个动画效果让让标题消失和长度变回原来的大小。 主要的方法$(this).animate({width:90},400,function(){ //定义当前动画让长度通过动画变成90长度在0.4秒完成 $(this).children(".title").css("display","block") 阅读全文
posted @ 2013-12-23 21:22 Ranran 阅读(1498) 评论(0) 推荐(0) 编辑
摘要:在程序语言中定义的各种各样的数据类型中,我们都会为其定义一个"空值"或"假值",比如对象类型的空值null,.NET Framework中数据库字段的空值DBNull,boolean类型的假值false等等。在JavaScript中也有很多种的"空值"和"假值",那么它们都有什么共同点和不同点呢? 其实标题里面我已经列出了JavaScript中所有的"空值"和"假值",除了boolean值本身就是true和false这两种情况外,其它数据类型的"空值"主要 阅读全文
posted @ 2013-12-23 11:25 Ranran 阅读(739) 评论(0) 推荐(0) 编辑
摘要:最简单的一种情形就是把一个小的、固定宽度的div元素和其他元素内容一起放在一个大的div中,比如下面: A Column Main Content Lorem ipsum 我们可以为#inner设定一个宽度值20%,但是由于div是块级元素,即使设定了宽度,其后面的内容也只能在下一行中显示,除非给它设定一个浮动属性那么此时会产生上面提到的问题了。 如果#inner的宽度和高度都比#outer小,这不会有问题。 但是,如果#inner的高度超过了#outer,那么的底部就会超出#outer的底部。这是因为为#inne... 阅读全文
posted @ 2013-12-21 13:19 Ranran 阅读(673) 评论(0) 推荐(0) 编辑
摘要:一个web前端工程师,应该知道jquery的.live()函数,知道它是做什么用的,但是不知它是怎么样工作的,使用起来也是不得得心应手的,甚至也没听说过.die()(去掉bind事件)。即使你能熟悉这些,但是你能意识到.die()的问题所在吗? 什么是.live()?函数的.live()类似.bind(),除此之外,它允许你绑定事件DOM元素,现在和动态生成出来的dom节点,你可以绑定事件不存在的元素。比方说当用户在点击链接时及想提示他们正在离开站点。$(document).ready( function() { $(‘a’).click( function() { ... 阅读全文
posted @ 2013-12-20 22:01 Ranran 阅读(1352) 评论(1) 推荐(0) 编辑
摘要:分页按钮思想: 1、少于9页,全部显示 2、大于9页,1、2页显示,中间页码当前页为中心,前后各留两个页码 先看效果图: 01输入框焦点效果 02效果 模仿淘宝的分页按钮效果控件kkpager JS代码:var kkpager = { //divID pagerid : 'div_pager', //当前页码 pno : 1, //总页码 total : 1, //总数据条数 totalRecords : 0, //是否显示总页数 isShowTota... 阅读全文
posted @ 2013-12-20 13:16 Ranran 阅读(2419) 评论(1) 推荐(1) 编辑
摘要:五:文字溢出bug(注释bug)1、在以下情况下将会引起文字溢出bug一个容器包含2两个具有“float”样式的子容器。第二个容器的宽度大于父容器的宽度,或者父容器宽度减去第二个容器宽度的值小于3在第二个容器前存在注释(这也是为什么此bug也叫做“IE6注释bug”的原因)。2、引起bug时的效果图这是正常效果 IE6下却多了一个“怪”字,真是怪3、修复该bug的解决方案改变结构,不出现【一个容器包含2两个具有“float”样式的子容器】的结构。——此解决方案的评论:疯了!因噎废食的做法。减小第二个容器的宽度,使父容器宽度减去第二个容器宽度的值大于3,例如将本文示例中第二个子容器的宽度改为19 阅读全文
posted @ 2013-12-19 14:36 Ranran 阅读(683) 评论(0) 推荐(2) 编辑
摘要:最近在一个私活做手机项目时候,需要实现一个类似ios 6中短信那样的气泡效果。这里分享下实现心得,希望能给大家一点启发。首先分析下iphone的气泡效果有一下特点1. 四面圆角2. 界面上向下的外阴影3. 上边和下边的内阴影4. 上边内的一个内嵌的玻璃气泡的反光效果因为文字的长度、高度,内容多少都未知,所以如果用图片,会涉及到了多张拼贴,而且效果不好,所以就选择了CSS3。首先定义一个容器,盒模型为display: inline-block,方便自适应文字大小.bubble {position: relative;display: inline-block;min-width: 30px;ma 阅读全文
posted @ 2013-12-19 11:44 Ranran 阅读(818) 评论(0) 推荐(0) 编辑
摘要:jQuery插件的开发包括两种:一种是类级别的插件开发,即给jQuery添加新的全局函数,相当于给jQuery类本身添加方法。jQuery的全局函数就是属于jQuery命名空间的函数,另一种是对象级别的插件开发,即给jQuery对象添加方法。下面就两种函数的开发做详细的说明。1、类级别的插件开发类级别的插件开发最直接的理解就是给jQuery类添加类方法,可以理解为添加静态方法。典型的例子就是$.AJAX()这个函数,将函数定义于jQuery的命名空间中。关于类级别的插件开发可以采用如下几种形式进行扩展:1.1 添加一个新的全局函数添加一个全局函数,我们只需如下定义:jQuery.foo = f 阅读全文
posted @ 2013-12-18 15:02 Ranran 阅读(629) 评论(0) 推荐(0) 编辑
摘要:什么是跨域1、document.domain+iframe的设置2、动态创建script3、利用iframe和location.hash4、window.name实现的跨域数据传输5、使用HTML5 postMessage6、利用flash本文来自网络(http://f2e.me/200904/cross-scripting/,该网址已不能访问),仅作个人读书笔记之用,并稍作修改和补充。什么是跨域JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象。但在安全限制的同时也给注入iframe或是ajax应用上带来了不少麻烦。这里把涉及到跨域的一些问题简单地整理一下:首先什么是跨域, 阅读全文
posted @ 2013-12-18 06:39 Ranran 阅读(736) 评论(2) 推荐(0) 编辑
摘要:on函数是在jquery 1.7 加入的描述: 在选定的元素上绑定一个或多个事件处理函数。定义:.on( events [, selector ] [, data ], handler(eventObject) )参数:events类型: String一个或多个空格分隔的事件类型和可选的命名空间,或仅仅是命名空间,比如"click", "keydown.myPlugin", 或者 ".myPlugin"。selector类型: String一个选择器字符串,用于过滤出被选中的元素中能触发事件的后代元素。如果选择器是 null 或者忽略 阅读全文
posted @ 2013-12-17 14:48 Ranran 阅读(752) 评论(0) 推荐(1) 编辑
摘要:最近发现在.NET平台下使用Web服务还是很简单的。下面举个在.NET平台下创建Web服务的简单例子。首先用Visul Studio .Net创建一个C# 项目Asp.Net Web服务程序,源代码如下:using System;using System.Collections;using System.ComponentModel;using System.Data;using System.Diagnostics;using System.Web;using System.Web.Services;namespace author{/// /// Service1 的摘要说明。/// pu 阅读全文
posted @ 2013-12-17 13:35 Ranran 阅读(1052) 评论(0) 推荐(2) 编辑
摘要:来源:Robert’s talk原文:http://robertnyman.com/2010/12/02/css3-flexible-box-layout-module-aka-flex-box-introduction-and-demostest-cases/Web布局一直个是难点,但貌似现在我们有更好的选择了。背景首先,我们有表格布局。当不考虑语义并且利用一些适当的嵌套和其他技巧,我们可以用table建立具有一定功能的布局。然后是现在大多数人都在使用的浮动布局。我们可以使用任何我们想用的元素,但浮动并不适用于初学者。表面上它看起来很基础,但背后复杂的功能可以使经验丰富的开发者看着自己的屏幕 阅读全文
posted @ 2013-12-16 21:34 Ranran 阅读(756) 评论(0) 推荐(0) 编辑
摘要:最近在学习HTML5和CSS3,印象最深的是CSS3的动画功能,不仅有浏览器原生支持,执行效率高,而且免去在js中自己管理timer。本来想写一个图片轮播器练练手,结果在网上发现一个国人写的开源的图片轮播器。不仅效果很酷,而且是“女神级”的。什么?你问是不是妹子写的?这个我不知道,我说的是这个Demo中的图片都是女神呀,性感火辣,丰满妩媚……咳咳,回正题。Demo的页面是http://alloyteam.github.io/jxanimate/想看女神的自己点吧。看链接就知道是alloyteam的作品。你没听说过Alloyteam?Alloyteam就是腾讯负责开发WebQQ的队伍,他们有很多 阅读全文
posted @ 2013-12-16 16:53 Ranran 阅读(3059) 评论(0) 推荐(0) 编辑
摘要:很多时候,我们需要获取用户的键盘事件,下面就一起来看看jquery是如何操作键盘事件的。一、首先需要知道的是:1、keydown() keydown事件会在键盘按下时触发.2、keyup() keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件3、keypress() keypress事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键二、获得键盘上对应的ascII码:$(document).keydown(function(event){ console.log(event.keyCode);});$tips:上面例子中,event.keyCode就可以帮助我... 阅读全文
posted @ 2013-12-13 13:17 Ranran 阅读(474) 评论(0) 推荐(0) 编辑
摘要:今天写了一个小小的提示成功的页面,同时要求返回上一页面,并实现对上一页面的操作进行刷新(例如删除的,添加的),在网上搜寻了一遍,基本上90%的都是说的是用window.history.go(-1), 或者是用 window.history.back(-1), 还有的说子页面刷新父页面用经过在JSP页面的测试,在操作页面选中添加的项经过点击按钮保存再跳转到成功提示页面返回后发现都没有刷新,手动刷新后才显示出来,对于那些粘贴复制技术不经过测试的文章实在是伤心透顶。其实对于这个技术,我并没有找到完全依赖JS能实现,有个思路就是使上一页不被缓存,每次读取出来就行了(别人的思路,具体我也没有搞懂原理)J 阅读全文
posted @ 2013-12-13 07:17 Ranran 阅读(1808) 评论(1) 推荐(0) 编辑
摘要:最近在写页面的时候常常遇到要动态增删改下拉框select的情况,由于我比较习惯用jquery框架来架构我的前端js,所以就顺便把各种jquery操作下拉框select的方法总结了一下,收藏起来以便下次用到的时候拿出来翻翻,当然也把这些分享给大家,或许收藏它会给你今后写jquery带来方便。1、jquery获取当前选中select的text值varcheckText=$("#slc1").find("option:selected").text();2、jquery获取当前选中select的value值varcheckValue=$("#slc1 阅读全文
posted @ 2013-12-12 12:28 Ranran 阅读(874) 评论(0) 推荐(0) 编辑
摘要:RSS是一种基于XML的文件标准,通过符合RSS规范的XML文件可以简单实现网站之间的内容共享。Ajax是AsynchronousJavaScriptandXML的缩写。通过Ajax技术可以经由超文本传输协议(Http)向一个服务器发出请求并且在等待该响应时继续处理另外的数据。通过Ajax技术可以很容易实现读取远程XML文件,因此,可以使用Ajax技术实现远程访问依据RSS标准生成的摘要信息,甚至我们可以自己写一个RSS阅读器。Ajax并不是一门新的语言或技术,它实际上是几项技术按一定的方式组合在一起。共同在协作中发挥各自的作用,它包括:使用XHTML和CSS标准化呈现;使用DOM实现动态显示 阅读全文
posted @ 2013-12-11 16:10 Ranran 阅读(1074) 评论(1) 推荐(0) 编辑
摘要:为什么我们要进一步提炼一系列元素,难道是jQuery选择语法不够强大?让我们从示例开始。在下面提到的网页中,当一个star被点击时,我们需要给它以及左边的每个star添加class"on"。首先,让我们看看下图所示的简单的页面,通过这个教程我们将选择这些元素。◆div.container是包裹元素;◆div.photo、div.title、div.rating是div.container的直接子级;◆每个div.star是div.rating的子级;◆当div.satr的class为"on"时,它是一个完整的star。与此同时,我们要改变所有star父元 阅读全文
posted @ 2013-12-10 21:33 Ranran 阅读(965) 评论(0) 推荐(3) 编辑
摘要:今天在看一本书时又看到了”CSS优先权“这个问题,感觉这个问题还是比较重要的,也算是样式的特异性吧,尤其是在面对较多、较深层、较复杂的样式属性时,理解CSS的加权计算方法对于重写样式属性之类的问题都会迎刃而解。那么接下来我就把CSS的执行顺序及其优先权问题做一个小小的总结吧。1、CSS的执行顺序在说CSS的执行顺序之前首先让我们看一下CSS的几种使用方式:·外联样式表通过语句 导入CSS样式文件·内联样式表直接在里面写入内嵌样式表直接在HTML里面写入CSS样式(虽然不提倡这么做,但在这里为了说明问题还是要提一下),如: BeyondWeb.cn-记录与分享前端开发的点点滴 阅读全文
posted @ 2013-12-10 14:30 Ranran 阅读(980) 评论(0) 推荐(3) 编辑
摘要:Javascript在互联网上名声很臭,但你又很难再找到一个像它这样如此动态、如此被广泛使用、如此根植于我们的生活中的另外一种语言。它的低学习门槛让很多人都称它为学前脚本语言,它另外一个让人嘲笑的东西是动态语言的概念是偏偏使用了高标准的静态数据类型。其实,你和Javascript都站错了立场,而现在,你让Javascript很生气。这里有五个原因能说明你的Javascript技术很烂。1. 你没有使用命名空间。是否还记得在大学里老师告诉你不要在家庭作业里使用全局变量?Javascript里的全局变量的使用方法也不例外。Web网页稍不留神就会变的混乱不堪、到处都是从互联网上各个角落里找来的乱糟糟 阅读全文
posted @ 2013-12-10 06:14 Ranran 阅读(1121) 评论(0) 推荐(4) 编辑
摘要:在我们设计制作一些网页的时候可能会用到半透明的效果,首先我们可能会想到用PNG图片处理,当然这是一个不错的办法,唯一的兼容性问题就是ie6 下的BUG,但这也不困难,加上一段js处理就行了。但假如我们需要一个半透明遮罩的弹出层,如登陆框、注册框、提示等,这时可能需要整个页面都要被半透 明的遮罩层覆盖,那么如用背景平铺的话,此时此刻也许就不是一个好办法了,图片大了会影响加载速度,图片小了同样会增加页面的渲染计算量,那么这时也许就 需要用CSS滤镜了。假如有这样一个例子:“有一个DIV块,此DIV是黑色半透明的,但此DIV里面的内容要保持原状,不能透明”,那么我们该怎么做呢?假如HTML部分我们这 阅读全文
posted @ 2013-12-09 22:18 Ranran 阅读(3664) 评论(1) 推荐(3) 编辑
摘要:回想一下,以前我们不得不花费大量时间去优化页面内容(图片、CSS等等),如今用户有更快速的互联网链接,我们似乎能够使用更大的图像或更大的闪 存文件,里面包含的有视频或者图片。然而,随着移动开发的兴起,我们又回到了过去的窘状。网站优化是十分重要的,需要下载的内容少,反应速度快,就能使我 们加载应用程序更快速。图片:控制在合适的尺寸大小很多时候我们在不同的网站使用同样的图像,例如一个网上商店,所有产品 都 有一个概览图片。打个比方,有三个页面描述产品,第一个页面显示产品清单,第二个页面显示产品细节图,第三个页面显示产品原始大小图。因此,我们需要三种 不同大小的图片。如果使用一个文件放到不同的三个页 阅读全文
posted @ 2013-12-09 19:29 Ranran 阅读(960) 评论(0) 推荐(2) 编辑
摘要:在做页面统计的时候遇到了两个问题:1.包含iframe的页面,在IE下按后退按钮不能刷新主页面。隐藏Iframe的src是统计程序的url,每点一次后退,就会发出一次页面加载时间请求。2.由js动态创建的img标签会发出两个http请求,第一个请求在发出后就被aborted,但实际上统计脚本收到了该请求,造成数据重复入库。针对第一个问题,怀疑是IE针对iframe处理同firefox不同。后来查资料才知道,IE会把iframe访问过的页面也记录进history,点击后退按钮时,其实是重新载入iframe中的url,因此表面上看起来是主页面不能刷新,其实隐藏的iframe是刷新了的,因此会造成点 阅读全文
posted @ 2013-12-08 21:56 Ranran 阅读(8064) 评论(1) 推荐(1) 编辑
摘要:web打印在一些开发中是比较常见的需求,最简单的办法是使用css print进行控制;对于一些建议可以参考http://slodive.com/web-development/css-print-page-tricks/;但是有时候我们需要设置背景或者其他类似的功能;如果不引入浏览器插件,我尝试了一下方法进行解决。1、如图:我想打印图中的投票结果条,该条之前是使用纯css实现,但是在IE上无法打印;目前是使用css背景+图片实现; .myprogress { background: #f5f5f5!important; filter: progid:D... 阅读全文
posted @ 2013-12-07 11:20 Ranran 阅读(5488) 评论(2) 推荐(0) 编辑
摘要:Javascript 的很多扩展的特性是的它变得更加的犀利, 同时也给予程序员机会创建更漂亮并且更让用户喜欢的网站。尽管很多的开发人员都乐于颂扬 javascript,但是仍旧有人看到它的阴暗面。使用很多 javascript 代码的 web 页面会加载很慢,过多的使用 javascript 使得网页丑陋和拖沓。很快如何有效地使用 javascript 成为一个非常火热的话题。这里让我们列出 10 个最佳 javascript 实践,帮助你有效地使用 javascript。1. 尽可能的保持代码简洁可能大家都听到过了N遍这个代码简洁问题了。作为一个开发人员你可能在你的代码开发过程中使用了很多次 阅读全文
posted @ 2013-12-07 09:46 Ranran 阅读(1224) 评论(4) 推荐(4) 编辑
摘要:一、 CSS样式兼容1. FLOAT闭合(clearing float)网页在某些浏览器上显示错位很多时候都是因为使用了float浮动而没有真正闭合,这也是div无法自适应高度的一个原因。如果父div没有设float而其子div却设了float的话,父div无法包住整个子DIV,这种情况一般出现在一个父DIV下包含多个子DIV。解决办法:1) 给父DIV也设上float2) 在所有子DIV后新加一个空DIV(目前Ext是这么做的),比如:.parent{width:100px;}.son1{float:left;width:20px;}.son2{float:left;width:80px;} 阅读全文
posted @ 2013-12-06 16:21 Ranran 阅读(1512) 评论(3) 推荐(6) 编辑
摘要:原文The 30 CSS Selectors you Must Memorize由 Jeffrey Way 发表于 2012 年 6 月,介绍了 30 种最常用的 CSS 选择器用法,多加了一种,变成了牢记 31 种选择器用法。其他 CSS3 选择器用法请查看CSS3 selectors explained这篇文章,此外,W3C CSS3 选择器官方文档Selectors Level 3 W3C Recommendation 29 September 2011记录在这里留待有疑问的时候查看。1.** { margin: 0; padding: 0;}星号选择器用于选取页面中的所有元素,可用.. 阅读全文
posted @ 2013-12-06 15:48 Ranran 阅读(1317) 评论(0) 推荐(5) 编辑
摘要:一般tips都是文字,这个可以支持图片,很漂亮: 演示 CSS文件如下: HTML代码: ... 阅读全文
posted @ 2013-12-06 14:00 Ranran 阅读(856) 评论(0) 推荐(0) 编辑
摘要:“珍惜生命,远离IE6”,IE6中的bug令很多Web前端开发人员实为头疼,因此不知道烧了多少脑细胞,在众多的Bug中最令人抓狂的就是IE对png图片的不支持,导致设计师和重构师放弃了很多很炫的效果,为了让大家在这方面少烧点脑细胞,KwooShung我就舍身一把,把当前最流行最实用的IE6支持PNG图片的方案整理到本贴内,以供大家学习参考!方案1 - 滤镜解决方案:介绍:滤镜从IE4.0被微软正式引入,所以我们可以使用滤镜解决IE6的PNG透明问题,滤镜不仅可以实现目前CSS3的一些旋转效果而且还可以引入图片。注意:此方法在部分版本的IETest中无效,建议使用标准的IE6来进行测试!目录说. 阅读全文
posted @ 2013-12-05 16:01 Ranran 阅读(671) 评论(0) 推荐(0) 编辑
摘要:Javascript是一门非常灵活的语言,我们可以随心所欲的书写各种风格的代码,不同风格的代码也必然也会导致执行效率的差异,开发过程中零零散散地接触到许多提高代码性能的方法,整理一下平时比较常见并且容易规避的问题Javascript自身执行效率Javascript中的作用域链、闭包、原型继承、eval等特性,在提供各种神奇功能的同时也带来了各种效率问题,用之不慎就会导致执行效率低下。1、全局导入我们在编码过程中多多少少会使用到一些全局变量(window,document,自定义全局变量等等),了解javascript作用域链的人都知道,在局部作用域中访问全局变量需要一层一层遍历整个作用域链直至 阅读全文
posted @ 2013-12-04 21:07 Ranran 阅读(919) 评论(0) 推荐(0) 编辑
摘要:网上看到的一篇小文,挺有用的,收藏在这。本文中,我整理了12个免费的Ajax和JavaScript代码库,可以帮助Web开发人员将应用程序提升到一个新水平。Ajax Instant Messenger它是最流行和常用的Ajax代码解决方案之一。这是一个基于浏览器的即时通讯客户端,适用于社区、内部网和社交网。Ajax IM无需页面刷新。Lightbox 2Lightbox 2是最常用的Ajax脚本之一,用于覆盖页面上的图像。它兼容所有现代浏览器,并使用了Prototype框架和Scriptaculous效果库。TimelineTimeline结合了Ajax和DHTML技术,允许你创建美观的交互式 阅读全文
posted @ 2013-12-04 09:18 Ranran 阅读(614) 评论(1) 推荐(0) 编辑
摘要:工作中遇到的业务场景,和同事一起研究了下,主要是为了兼容IE版本其实就是一些琐碎的知识点在网上搜集下解决方式,然后集成了下,主要有以下点:1. IE input type=file的图片预览要用IE的filter css progid:DXImageTransform.Microsoft.AlphaImageLoader chrome/firefox则用File api的file reader2. 图片旋转,IE用progid:DXImageTransform.Microsoft.Matrix的filter(filter可以组合用,用空格隔开) chrome/firefox用canvas3. 阅读全文
posted @ 2013-12-03 09:56 Ranran 阅读(1798) 评论(1) 推荐(1) 编辑
摘要:三、position:fixed无效今天在IE6上遇到一个bug,本来想做一个消息提示框,让他在页面右上角停留一段时间后消失,这段时间内提示框随着页面的下拉一直出现在浏览器可见区的顶部,于是我用到了css的一个属性position:fixed,但遗憾的是在IE6下这个属性不起作用,悲剧的IE6,于是便找解决方案,现把最佳的解决方案拿出来与大家分享,或许不久的将来你能用上。1、要实现的效果如下图:这时弹出提示在浏览器最右上角可见区这时浏览器向下滚动了一下,但要让弹出层保持在浏览器最右上角可见区2、兼容的解决方案代码如下:css代码如下.loading_tip { position: fixed; 阅读全文
posted @ 2013-12-02 21:12 Ranran 阅读(728) 评论(1) 推荐(1) 编辑
摘要:有一个网址,可以返回我们要的内容。http://r.qzone.qq.com/cgi-bin/user/cgi_personal_card?uin=指定QQ号码将会返回下列内容:_Callback( {"uin":查询的QQ号码, "qzone":1, "nickname":"昵称", "offsetBirth":距离生日的天数, "avatarUrl":"查询的QQ号码头像地址"});因此,我们把它解析出来就可以了针对这个内容,对_Callback事先进 阅读全文
posted @ 2013-12-02 13:21 Ranran 阅读(1537) 评论(1) 推荐(0) 编辑

点击右上角即可分享
微信分享提示