博文
HTML CSS技巧 永恒不变的DIV-固定在浏览器某个位置-非JAVASCRI(2009-11-27 12:57:00)
摘要:这里稍微总结一下,一般是利用JavaScript脚本,从浏览器中获取各个关于位置的参数,然后将其计算后,定位在窗体的右下角.可以承认,这个方法确实是比较自然的想法,也是很常见的方法,但是这样的方法有以下几个缺点:
1,使用了大量的计算,每次滚动,都少不了一大堆的运算. 2,使用了JavaScript脚本,脚本这东西受到浏览器的限制,即便没有限制,也同样因为网页的下载模式问题,可能因为脚本下载未完成或者下载失败而致使脚本无法正确运行. 3,条条大路通罗马,但是看看那方块,当快速滚动滚动条的时候,会发现那个可爱的方块抖动地厉害.这也难怪,那么多的计算谁能受得了? 那有没有比较"平静"高效的表示方式呢?比如是否有一种用CSS的方式呢?
首先,我们将目光投向了CSS规范,我想很多人和我一样很快就想到了position属性,说到定位,我们很容易想到这个属性.这个属性一共有四个选项:static,relative,absolute,fixed.很高兴,我们在阅读了相关的注释后,我们大概能看到fixed是比较符合我们的需求的:
fixed:位置被设置为 fixed 的元素,可定位于相对于浏览器窗口的指定坐标.此元素的位置可通过 "left","top","right" 以及"bottom" 属性来规定.不论窗口滚动与否,元素都会留在那个位置.工作于 IE7(strict 模式).
查看效果:
http://www.txdnet.cn/essay/view.jsp?tid=1259296535890&cid=2
......
Jsp中使用Jquery读取Json数据(2009-11-19 12:50:00)
摘要:很实用的一个DEMO
http://www.txdnet.cn/essay/view.jsp?tid=1258170469211&cid=2
jsonData 可通过数据库查询生成JSON格式,输出到客户端,然后客户端通过AJAX获取后格式化数据并在HTML中展现出来* JSON使用方便,数据体积相对较小,结合JQUERY后非常容易上手使用.JSON+JQUERY已成非常流行的AJAX组合.......
CSS代码整理优化缩减工具(2009-10-25 12:09:00)
摘要:CSSTidy
CSSTidy是一个开源的CSS代码优化工具,这个工具可以运行在windows,linux和OSX系统下,通过控制命令行执行PHP脚本来优化CSS文件.其实是PHP写的一个小工具,当然可以运行在支持PHP的服务器上,通过WEB页面来处理.使用csstidy 可以轻易的将你的CSS 样式压缩,压缩率能达到1/4以上,还可以自动将CSS代码中的注释,多余的属性去掉,并将相似的样式合并以达到优化压缩CSS样式最大化.CSSTidy 本身没有内置Validator 验证工具,需要使用W3C 验证工具来确保CSS代码规范.
下载地址
http://www.txdnet.cn/essay/view.jsp?tid=1256319278098&cid=2......
CSS特效 仿淘宝首页导航条布局效果(2009-10-15 00:37:00)
摘要:http://www.txdnet.cn/essay/view.jsp?tid=1255537154328&cid=2......
优化jQuery开发的网页代码性能(2009-10-12 21:27:00)
摘要:现在jquery应用的越来越多, 有些同学在享受爽快淋漓coding时就将性能问题忽略了. jquery虽在诸多的js类库中性能表现还算优秀, 但毕竟不是在用原生的javascript开发, 性能问题还是需要引起重视的. 在twitter上发现了<jQuery Performance Rules>这篇文章, 简单的摘译了一下:总是从ID选择器开始继承 在class前使用tag 将jquery对象缓存起来 掌握强大的链式操作 使用子查询 对直接的DOM操作进行限制 冒泡 消除无效查询 推迟到 $(window).load 压缩js 全面掌握jquery库 ......
JQuery中文入门指南(2009-08-28 10:59:00)
摘要:JQuery中文入门指南JQuery官网:http://jquery.com/jQuery一个轻量级的ajax库我希望使用Ajax技术在web中在Ajaxcn上发现之前已经了解过mochikit,prototype.js,dojo一发现它就深深被吸引它的特点ChainabilityCollection of DOM elements(DOM元素集合)以Dom Scripts为中心优秀的文档丰富的插件活跃的社区代码层次通用层核心层(jQuery对象层)插件接口($.fn)神奇的$()用于返回一个jQuery对象支持CSS1-3 selector, XPath的语法可以用于创建Element元素$(fn)相当于$(document).read()this的处理可以很好的处理$()方法中的元素,在一些事件处理中可以简单的使用匿名函数$()提供的内置方法CoreDOMCSSJavascriptEffectsEventsAjaxJqueryApi文档
http://www.txdnet.cn/essay/view.jsp?tid=1873&cid=2......
Div CSS实现圆角矩形(2009-08-20 10:06:00)
摘要:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>testdiv</title><style>#d1,#d3,#d4{margin:5px 0px;width:200px;background-color:#eee;}#d1{border:1px solid #444;height:100px;padding:0px 15px;}#d3,#d4{margin-top:0px;margin-bottom:0px;border-left:1px solid #444;border-right:1px solid #444;}.m{height:100px;width:200px;padding:0px 15px;position:relative;}#d3 .m{margin:-4px 0px;}#d4 .m{margin:-5px 0px;}.rt,.rb{display:block;width:232px;margin-left:0px;margin-right:0px;}.rt{margin-top:5px;}.rb{margin-bottom:5px;}.rt *,.rb *{display:block;height: 1px;overflow: hidden;background-color:#eee;border-left:1px solid #444;border-right:1px solid #444;}.r1{margin: 0 5px;background-color:#444;}.r2{margin: 0 3px;border-width:0px 2px;}.r3{margin: 0 2px;}.r4{......
得到WEB URL请求后的参数变量值的Javascript函数(2009-08-17 00:48:00)
摘要:function getParam(p){var p1 = {};var p2 = location.href.match(/[^s&?=/#]+=[^s&?=/#]+/g);if(p2){for(var i = 0, l = p2.length; i < l; i++){var n = p2[i].split("=");p1[n[0]] = n[1];}}return ( typeof(p1[p]) == "undefined" )?'':p1[p];}
运行Demo 的GET请求
页面引入getParam()函数后,使用
alert(getParam('param'));
欢迎网友完善该函数,并及时邮件告诉我
http://www.txdnet.cn/essay/view.jsp?tid=1250171576656&cid=2......
lightTreeview jQuery树型菜单插件(2009-08-17 00:46:00)
摘要:当前开发WEB用的树形菜单插件比较多的是DTree,XTree, lightTreeview
前两个不在此文介绍,lightTreeview是一款依托Jquery而设计的树形菜单插件.
版本:1.0.0 在以下浏览器中测试通过:IE6.0 IE7.0Firefox 2.0.0 Opera 9.10Safari 3.04
点此查看详细文档和下载......
Javascript 定时器调用传递参数的使用方法(2008-05-28 14:39:00)
摘要:无论是window.setTimeout 还是window.setInterval,在使用函数名作为调用句柄时都不能带参数,而在许多场合必需要带参数,这就需要想方法解决.例如对于函数hello(_name),它用于针对用户名显示欢迎信息:var userName="Tony";//根据用户名显示欢迎信息function hello(_name){alert("hello,"+_name);}这时,如果企图使用以下语句来使hello函数延迟3 秒执行是不可行的:window.setTimeout(hello(userName),3000);这将使hello函数立即执行,并将返回值作为调用句柄传递给setTimeout 函数,其结果并不是程序需要的.而使用字符串形式可以达到想要的结果:window.setTimeout("hello(userName)",3000);这里的字符串是一段JavaScript 代码,其中的userName 表示的是变量.但这种写法不够直观,而且有些场合必须使用函数名,下面用一个小技巧来实现带参数函数的调用:<script language="JavaScript" type="text/javascript"><!--var userName="jack";//根据用户名显示欢迎信息function hello(_name){alert("hello,"+_name);}//创建一个函数,用于返回一个无参数函数function _hello(_name){return function(){hello(_name);}}window.setTimeout(_hello(userName),3000);//--></script>这里定义了一个函数_hello,用于接收一个参数,并返回一个不带参数的函数,在这个函数内部使用了外部函数的参数,从而对其调用,不需要使用参数.在window.setTimeout函数中,使用_hello(userName)来返回一个不带参数的函数句柄,从而实现了参数传递的功能.
http://www.txdnet.cn/ShowEssay-2-1611-Txdnet.jsp
更多请见小站 电脑世界
http://www.txdnet.cn/ShowListEs......
