代码改变世界

javaScript模拟select下拉菜单,满足自定义select样式的需求+jquery实现

2012-03-31 17:46 by VVG, 2914 阅读, 0 推荐, 收藏, 编辑
摘要:SELECT列表选择不支持样式设置,抽空用JS模拟了一个SELECT的样式,如下:下拉菜单样式模拟,模拟下拉菜单下拉菜单样式模拟,模拟下拉菜单代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equi 阅读全文

JavaScript 缓动焦点图实现的几种写法 封装 + 函数式 + JQuery

2012-03-28 11:58 by VVG, 2475 阅读, 1 推荐, 收藏, 编辑
摘要:焦点图原生JavaScript封装:调用方式:<script type="text/javascript"> vvg.slider.init('focus_pic'/**包裹图片的UL的ID**/, { v:1,//1表示垂直上下移动幻灯片 0表示左右移动幻灯片 height:180,//幻灯片高度 width:530,//幻灯片宽度 btnId:"fo... 阅读全文

JavaScript Tag标签切换实现的几种方法 原生js + jquery

2012-03-28 11:51 by VVG, 9052 阅读, 0 推荐, 收藏, 编辑
摘要:Tab标签切换 效果图:HTML部分:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; chars 阅读全文

CSS布局:三栏布局,中间栏固定宽度,左右两边自适应

2012-03-27 14:31 by VVG, 1925 阅读, 0 推荐, 收藏, 编辑
摘要:被这样一个题目的布局难住了,回来思考了一下,只能想到JS控制,今天在群里面咨询了一下,@狄烁STEC提到一个很好的方法, 很好代码如下:<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>CSS</title><style type="text/css">body{padding:0;margin: 阅读全文

CSS布局技巧之多列同高方法

2012-03-27 11:11 by VVG, 2230 阅读, 0 推荐, 收藏, 编辑
摘要:CSS多列布局同高如下所示:CSS实现三列DIV等高布局这确实是个很简单的问题,也许你也已经相当熟悉,但很多人还不知道。下面介绍的技术是一个简捷的小技巧,它一定可以帮助你解决这个头痛的问题。三列DIV等高这确实是个很简单的问题,也许你也已经相当熟悉,但很多人还不知道问题,也许你也已经相当熟悉,但很多人还不知道问题,也许你也已经相当熟悉,但很多人还不知道问题,也许你也已经相当熟悉,但很多人还不知道。下面介绍的技术是一个简捷的小技还不知道问题,也许你也已经相当熟悉,但很多人还不知道。下面介绍的技术是一个简捷的小技还不知道问题,也许你也已经相当熟悉,但很多人还不知道。下面介绍的技术是一个简捷的小技还 阅读全文

css清除浮动各方法

2012-03-09 14:47 by VVG, 344 阅读, 0 推荐, 收藏, 编辑
摘要:(1)空标签法: 这种方法应该说是最简单的一种了,W3C建议在容器的末尾增加一个“clear:both"的元素,强迫容器适应它的高度以便装下所有的float,并没限制使用什么样的标签,有用<br style=”clear:both”/>的,有用空<div style=”clear:both”></div>的;比如:<div> <div style ="float:left; width:40%;"> <p> Some content </p></div> <p&g 阅读全文

CSS/Javascript压缩工具taobao jsminifier[转]

2012-03-08 10:59 by VVG, 732 阅读, 0 推荐, 收藏, 编辑
摘要:Epile在网上找Javascript和CSS压缩软件的时候搜索到这款由淘宝在雅虎YUICompressed基础上开发的压缩工具,用起来还挺不错的。软件自带的安装说明说得不清楚,在这里Epile写了一个安装说明,并上传到Google Code分享给大家。本软件安装完毕可以直接在要压缩的文件点击右键使用,非常方便。安装说明下载jsMinifier安装Java SE Development Kit (JDK)打开“控制面板”,在其中打开“系统”,其下“高级”选项卡下的环境变量中的系统变量里添加变量名JAVA_HOME,变量值为Java SE Development Kit的安装目录,如“C:/Pr 阅读全文

利用Minify加速 优化网站性能教程

2012-03-08 10:42 by VVG, 1376 阅读, 0 推荐, 收藏, 编辑
摘要:Minify 是用PHP5开发的应用,通过遵循一些Yahoo的优化规则来提高网站的性能。它会合并多个CSS或者JavaScript文件,移除一些不必要的空格和注释,进行gzip压缩,并且会设置浏览器的缓存头。Minify 在设计上和Yahoo的 Combo Handler Service非常像,不过Minify可以合并任何你想要合并的JavaScript和CSS文件。一般情况下,网站速度的瓶颈都在前端,而最关键的就是资源的加载速度,但是大多数浏览器都有单个域名并发请求数限制,所以如果一个页面中存在很多的资源,比如CSS和JavaScript文件,那么明显会降低网站的加载速度,比较好处理方式就是 阅读全文

在服务端合并和压缩JavaScript和CSS文件[转]

2012-03-08 10:35 by VVG, 403 阅读, 0 推荐, 收藏, 编辑
摘要:Web性能优化最佳实践中最重要的一条是减少HTTP请求,它也是YSlow中比重最大的一条规则。减少HTTP请求的方案主要有合并JavaScript和CSS文件、CSS Sprites、图像映射(Image Map)和使用Data URI来编码图片。CSS Sprites和图像映射现在已经随处可见了,但由于IE6和IE7不支持Data URI以及性能问题,这项技术尚未大量使用。目前大部分网页中的JavaScript和CSS文件数量和开发时一致,少量的网页会根据实际情况采取本地合并,这些合并中相当多的是有选择地手动完成,每次新的合并都需要重新在本地完成并上传到服务器,比较的随意和繁琐,同样文件的压 阅读全文

使用ANT对Js/Css文件进行合并和压缩处理 [转]

2012-03-07 20:58 by VVG, 3260 阅读, 0 推荐, 收藏, 编辑
摘要:使用ANT对Js/Css文件进行合并和压缩处理Tag:javascript css ant减少HTTP请求是优化网站速度的一个重要手段, 所以对javascript/css两种文件进行压缩或合并都是非常必要的.这里介绍利用ANT来自动进行文件合并和压缩.3.1. javascript文件合并在开发阶段常常会把javascript文件分成几部分来写, 比如模块式的开发或多人合作, 或者使用一些外部库. 在生产环境下将比较小的文件合并成一个可以减少HTTP请求的次数, 从而达到优化的目的.这里假设你对ANT有一定了了解, 如果没有可以参考[ANT简单介绍].Example 1: 例子比如现在需要把 阅读全文