develop's blog,about web&game&mobile&so on!

jquery 基础总结

<Category: web> 发表评论

 $(document).ready(function(){})
//相当于onload事件

jQuery对象与dom对象的转换
$(“#msg”).html();
$(“#msg”)[0].innerHTML;
$(“#msg”).eq(0)[0].innerHTML;
$(“#msg”).get(0).innerHTML;

如何获取jQuery集合的某一项
$(“div”).eq(2).html();              //调用jquery对象的方法
$(“div”).get(2).innerHTML;       //调用dom的方法属性

同一函数实现set和get
$(“#msg”).html();              //返回id为msg的元素节点的html内容。
$(“#msg”).html(“<b>new content</b>”);
$(“#msg”).text();              //返回id为msg的元素节点的文本内容。
$(“#msg”).text(“<b>new content</b>”);

$(“#msg”).height();              //返回id为msg的元素的高度
$(“#msg”).height(“300″);       //将id为msg的元素的高度设为300
$(“#msg”).width();              //返回id为msg的元素的宽度
$(“#msg”).width(“300″);       //将id为msg的元素的宽度设为300

$(“input”).val(“);       //返回表单输入框的value值
$(“input”).val(“test”);       //将表单输入框的value值设为test

$(“#msg”).click();       //触发id为msg的元素的单击事件
$(“#msg”).click(fn);       //为id为msg的元素单击事件添加函数
同样blur,focus,select,submit事件都可以有着两种调用方法

集合处理功能
$(“p”).each(function(i){this.style.color=['#f00','#0f0','#00f']})
// 为索引分别为0,1,2的p元素分别设定不同的字体颜色。

$(“tr”).each(function(i){this.style.backgroundColor=['#ccc','#fff'][i%2]})
//实现表格的隔行换色效果

$(“p”).click(function(){.html())})
//为每个p元素增加了click事件,单击某个p元素则弹出其内容\

操作元素的样式
$(“#msg”).css(“background”);              //返回元素的背景颜色
$(“#msg”).css(“background”,”#ccc”)       //设定元素背景为灰色
$(“#msg”).height(300); $(“#msg”).width(“200″);       //设定宽高
$(“#msg”).css({ color: “red”, background: “blue” });//以名值对的形式设定样式
$(“#msg”).addClass(“select”);       //为元素增加名称为select的class
$(“#msg”).removeClass(“select”);       //删除元素名称为select的class
$(“#msg”).toggleClass(“select”);       //如果存在(不存在)就删除(添加)名称为select的class

绑定事件
$(“p”).bind(“click”, function(){.text());});       //为每个p元素添加单击事件
$(“p”).unbind();       //删除所有p元素上的所有事件
$(“p”).unbind(“click”)       //删除所有p元素上的单击事件

本文来自: jquery 基础总结

div+css使用技巧

<Category: web> 发表评论

div+css是网页排版中不可或缺的,在这里总结了一下工作中遇到的一些这方面的问题,以及这些问题的解决方法,在这里一起与大家分享(*^__^*) 嘻嘻……
1,ul方面的问题:默认的ul的margin和padding不是0,如果在导航中用到了左浮动的li,往往会把外部

的div撑大,导致页面变形,这就需要我们在写代码的时候不要忘记 ul{margin:0px; padding:0px;}

2,img方面的问题:这里牵涉的不同浏览器的问题,ie6是一直让网页设计师最头疼的一个问题,关于图片

,这里有一个小小的问题,有时ie6里显示的图片height总是要大于准确值,这里就需要我们记住下面这

一点 img{ display:block}

3,overflow方面问题:有时我们会看到,一些公司的注册协议都是好长好长的,但又不能把页面拉的太

长,这就用到了overflow,我们可以把div的style里加上这个:overflow:auto

4,小窗口弹出的问题:当我们点击某个按钮,可能会看到一个小窗口弹出,而窗口其它的部分都变了灰

色,这是怎么实现的呢,其实很简单div+css就可以实现:
css部分:
.black_overlay
{
    display: none;
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index: 1001;
    -moz-opacity: 0.8;
    opacity: .80;
    filter: alpha(opacity=50);
}
.white_content
{
    display: none;
    position: absolute;
    top:20%;
    left: 30%;
    width:outo;
    background-color: white;
    z-index: 1002;
    overflow: auto;

}

.white_content2
{
    display: none;
    position: absolute;
    top: 20%;
    left: 18%;
    width:896px;
    background-color: white;
    z-index: 1002;
    overflow: auto;
    text-align: center;
}
.qpshcom
{

    background-color: #efefef;
    color: #666666;
    border-width: 1px;
    border-color: #cccccc;
    border-style: solid;
    margin: 6px;
    padding: 6px;
    font-size: 14px;
    line-height: 200%;
    float: midden;
}
div部分:

打开按钮部分:onclick=”document.getElementById

(‘light’).style.display=’block’;document.getElementById(‘fade’).style.display=’block’”
关闭按钮部分:onclick=”document.getElementById

(‘light’).style.display=’none’;document.getElementById(‘fade’).style.display=’none’”

4,关于float的问题:有时候一些div会挤到页面的上方,把页面挤破掉,这里可能就是浮动引起的,这

时候我们就用到了这个:clear:both,很不错的解决方法,不妨一试。

5,height等于1px的div,在ie6中可能并不是1px,那怎么解决呢?不妨试一下:在这个div的style里加

上font-size:1px;这样就ok了。

6,下面再说一下id和class的问题:当一个div要在页面中多次使用时,不要用id,要用class,还有就是

要用引用js的时候,样式最好不要用id,因为id要留给js使用,当程序员写后台用的是.net时,最好不用

用id,id要留给程序员用,前台我们就用class好了。

7,还是img问题,页面中最好不要用大块背景,能平铺的要平铺,否则加载起来会很慢,也不利于以后的

优化和扩展,当然也有些大的网站,现在都尽量把背景统一放到一张图片上,用background-postion来取

得背景,这样其实也好,背景虽然大了点,但只需统一加载一次,就ok了,速度也不会太慢,可以好好学

习一下。

8,img的格式问题:最好的格式就是gif格式,即确保了背景透明,在ie6中又不会有阴影,有时gif图片

会有锯齿,这就需要我们保存成web格式,设置一下matter,matter的值用背景颜色的值越相近越好。(

当然有时迫不得已png的图片也会用到,这时就需要另外想办法了,前面我也曾提到过,大家不妨一看)

9,链接问题:
.link:link{}
.link:visited{}
.link:hover{}
.link:active{}
有一点,visited与hover的顺序一定不能倒换,否则ie6中会大大的问题。

10,css编码问题:@charset “utf-8″;注意这行代码,utf-8与g把gb2312是比较常用的两种编码方式。
       

本文由 站酷网fangjing19881116 原创,转载请保留此信息,多谢合作。

本文来自: div+css使用技巧

编写Smarty遇到的编码问题

<Category: web> 1 条评论

今天在写Smarty的时候,在ie6里网页无法居中,在ff和其他浏览器都非常正常,网上查了好久发现,说去w3c验证一下,会看到是我的html里面有BOM(万国码档案签名:Byte Order Mark, U+FEFF),真晕啊!然后把要输出smarty的php的编码中的bom去掉就可以了。。。

btw:我当时用的编辑器是FlashDevelop,在文件-编码-save byte order mark选项里面。

以下引用网络:

在Dreamweaver 中写了个简单的的index.php:

<?php
include_once(“./class.config.php”);
$Smarty->display(“Index.html”);
?>

顺手在标题中输入了几个字:企业资源管理系统,index.html是使用div+css进行布局的,单独打开index.html可以看到居中显示,而调用smarty后总是居左显示.

后来用ultraedit打开index.php,发现文件内容是:

<title>企业资源管理系统</title>

<?php
include_once(“./class.config.php”);
$Smarty->display(“Index.html”);
?>

将<title>企业资源管理系统</title>去掉后显示正常.

引用原文:

发现自己总在走前人走过的路,犯前人犯过的错…

最近使用smarty+CSS模板,遇到了部分CSS无法解析的问题,尝试了很多方法,在几乎放弃的时候找到了这篇文章,一看日期,竟然是2006年11月的…

新项目完全采用UTF-8编码,这是我的夙愿,可就是这个麻烦的UTF-8编码,让我闹心了数小时!
今天下午制作好了页面的模板,当载入Smarty运行的时候,发现在Firefox下正常显示,而在IE下,原本好好居中显示的页面一下变得偏左了,而且部分CSS也无法载入,字体极其难看!查阅代码,无法找出任何破绽,而不用Smarty转而采用原始的PHP+HTML混写的时候则无此现象,因此开始怀疑Smarty有问题,上phpchina.cn求助,无人解答;自己又下载了Smarty的最新版本,依然无法解决这个故障,心灰意冷,甚至打算在项目中放弃Smarty。
根据以往的经验,我开始怀疑是当PHP输出HTML的时候向其中加入了额外的不可见代码,于是将PHP输出的内容原封不动保存为HTML,然后提交到validator.w3.org进行XHTML验证,果然,验证失败,提示文件头部被加入了BOM(万国码档案签名:Byte Order Mark, U+FEFF)标记,妈的,就是这个垃圾标记,已经不是第一次害我了!
于是,重新打开DM和UltraEdit重新对PHP页面以及模板页面进行编码转换,去除了其中的BOM标记,一切正常!
这里附上一篇写的很全面的有关BOM的文章,希望能帮助和我一样受害的人。
=================================================================

utf-8 保存文件的 bom 问题

大家都知道 utf-8 是一种在web应用中经常使用的一种 unicode 字符的编码方式,使用 utf-8 的好处在于它是一种变长的编码方式,对于 ANSII 码编码长度为1个字节,这样的话在传输大量 ASCII 字符集的网页时,可以大量节约网络带宽。不过如果大家使用 utf-8 编码来编写网页的时候, 往往会因为 bom (Byte Order Mark) 的问题,导致网页中经常出现一些不明的空行或者乱码字符。 这些都是因为 utf-8 编码方式对于 bom 不是强制的。因此 utf-8 编码在保存文件的时候,会出现不同的处理方式。

比如有的浏览器(FireFox)可以自动过滤掉所有 utf-8 bom , 有的 (IE) 只能过滤掉一次 bom (为什么是一次? 当你出现 Include 多次文件时就会碰上这个问题了:) );

对此 w3.org 标准 FAQ 中对此问题有一个专门的描述:

http://www.w3.org/International/questions/qa-utf8-bom

在此个人认为对于这个问题最好的处理方式就是在编辑(保存)文件的时候统一去除 utf-8 bom , 同时又必须使得编辑器可以正确读出 utf-8 字符集,但可惜目前 windows 系统中对于保存文件的处理方式缺省情款下都会自动加上 bom.

(通过抓包工具分析, google 中文页面统一使用 utf-8 编码方式,下载的页面中没有带有 bom 标识)

操作系统: WindowsXP Professional , 缺省字符集:中文

1) notepad : 可以自动识别出没有带 bom 的 utf-8 编码格式文件,但不可以控制保存文件时是否添加 bom , 如果保存文件,那么会统一添加 bom 。

2)editplus : 不能自动识别出没有 bom 的 utf-8 编码格式文件,保存文件为 utf-8 时会自动添加 bom

3) UltraEdit : 对于字符编码的功能最为强大, 可以自动识别带 bom 和不带 bom 的 utf-8 文件 (可以配置) ; 保存的时候可以通过配置选择是否添加 bom.

(特别需要注意的是,保存一个新建立的文件时,需要选择另存为 utf-8 no bom 格式)

后来发现 Notepad ++ 也对于 utf-8 bom 支持比较好,推荐大家使用。

本文来自: 编写Smarty遇到的编码问题

LoaderMax – Smart AS3 Loading

<Category: flash> 1 条评论

LoaderMax is a new AS3 loading system that does much more than just get swf, mp3, css, video, image, text, binary, and xml files into your Flash application. It eats files for dinner, burps, and then asks for 2nds. And 3rds. Yet it’s surprisingly thin. In fact, it can be half the size of most other loading systems even though it delivers a bunch of unique capabilities, some of which you probably never knew you needed but won’t want to live without. Here are a few of the noteworthy features:

http://www.LoaderMax.com

  • Integration of loaders inside subloaded swfs – with most other systems, if you subload a swf, the loader will only concern itself with the swf file’s bytes but what if that swf must subload other content like XML, images, and/or other swf files before it should be considered fully loaded? LoaderMax can elegantly handle the sub-subloads as deep as they go. You can link any loader and/or LoaderMax with a swf’s root (using the requireWithRoot vars property) so that when you subload it into another Flash application, the parent SWFLoader automatically factors the nested loaders into its overall loading progress! It won’t dispatch its COMPLETE event until they have finished as well.
  • Automatic parsing of LoaderMax-related nodes inside XML – The XMLLoader class automatically looks for LoaderMax-related nodes like <LoaderMax>, <ImageLoader>, <SWFLoader>, <XMLLoader>, <VideoLoader>, <DataLoader>, <CSSLoader>, <MP3Loader>, etc. in XML files that it loads, and if any are found it will create the necessary instances and then begin loading the ones that had a load=”true” attribute, automatically integrating their progress into the XMLLoader’s overall progress and it won’t dispatch a COMPLETE event until the XML-driven loaders have finished as well. See XMLLoader’s ASDocs for details.
  • Tight file size – Many other systems are 16-24k+ even if you’re just loading text, but LoaderMax can be as little as 7k (depending on which loader types you use).
  • Define an alternateURL for any loader – If the original url fails to load, it will automatically switch to the alternateURL and try again.
  • A common set of properties and methods among all loaders – All loader types (XMLLoader, SWFLoader, ImageLoader, MP3Loader, CSSLoader, VideoLoader, LoaderMax, etc.) share common properties like: content, name, status, loadTime, paused, bytesLoaded, bytesTotal, and progress as well as methods like: load(), pause(), resume(), prioritize(), unload(), cancel(), auditSize() and dispose() delivering a touch of polymorphism sweetness.
  • Nest LoaderMax instances inside other LoaderMax instances as deeply as you want. – A LoaderMax instance is basically a queue of loaders which makes it simple to control them as a whole and get the overall progress, bytesLoaded, and/or bytesTotal. You can put a queue into another – group and nest them however you want. This makes complex queues simple. Need to know when the first 3 loaders have finished loading inside a 10-loader queue? Just put those 3 into their own LoaderMax that has an onComplete and nest that LoaderMax inside your main LoaderMax queue.
  • Set a width/height for an ImageLoader, SWFLoader, or VideoLoader and when it loads, the image/swf/video will automatically scale to fit using any of the following scaleModes: “stretch”, “proportionalInside”, “proportionalOutside”, “widthOnly”, or “heightOnly”.
  • Conveniences like auto smoothing of images, centering their registration point, noCache, setting initial x, y, scaleX, scaleY, rotation, alpha, and blendMode properties, optional autoPlay for mp3s, swfs, and videos, and more.
  • Works around common Flash hassles/bugs – LoaderMax implements workarounds for things like garbage collection headaches with subloaded swfs, images, and NetStreams as well as other problems like the recently discovered issues with subloading swfs that use TLF.
  • Find loaders and content by name or url – Every loader has a name property which you can use to uniquely identify it. Feed a name or URL to the static LoaderMax.getLoader() or LoaderMax.getContent() methods to quickly get the associated loader or content.
  • A single loader can belong to multiple LoaderMax instances
  • Accurate progress reporting – For maximum performance, set an estimatedBytes for each loader or allow LoaderMax’s auditSize feature to automatically preload just enough of each child loader’s content to determine its bytesTotal, making progress reporting on large queues very accurate.
  • prioritize() a loader anytime – Kick an object to the top of all LoaderMax queues to which it belongs, immediately supplanting the top spot in each one.
  • A robust event system – events bubble up through LoaderMax hierarchies and carry a consistent target for easy identification
  • Set up multiple event listeners in one line – Add listeners like onComplete, onProgress, onError, etc. via the constructor like new LoaderMax({name:”mainQueue”, onComplete:completeHandler, onProgress:progressHandler, onError:errorHandler});
  • maxConnections – Set the maximum number of simultaneous connections for each LoaderMax instance (default is 2). This can speed up overall loading times.
  • pause()/resume() – no queue loading solution would be complete without the ability to pause()/resume() anytime.
  • Flex friendly – Simply change the LoaderMax.contentDisplayClass to FlexContentDisplay and then ImageLoaders, SWFLoaders, and VideoLoaders will return content wrapped in a UIComponent.

http://www.LoaderMax.com

本文来自: LoaderMax – Smart AS3 Loading

解决JQuery中load方法在ie里的缓存问题

<Category: rayYee> 发表评论

最近在研究JQuery,在做一个ajax效果时,遇到了ie中无法无刷新显示数据。

使用方法如下:
代码如下:
$(“#panel”).load(“test.asp”);
//在页面装载时,在ID 为#panel的DOM元素里test.asp的内容。

但是,当你修改test.asp文件的内容以后,在IE浏览器下,再利用以上方法 重新装载该文件时,你会发现ID为#panel的DOM元素的内容并未发生变化,问题究竟出现在什么地方呢?原来是重新加载以后,IE浏览器并没有从服务 器端重新下载修改以后的test.asp,而是直接从IE缓存中读取没有修改之前加载的那个test.asp文件,因此会出先#panel元素的内容没有 发生变化。
因此在使用以上方法之前需禁用该方法装载IE缓存中的文件,方法如下:
代码如下:
//在调用load方法之前利 用该方法禁止load方法调用IE缓存文件
$.ajaxSetup ({
cache: false
});

在$.ajax({})中也有设置cache为false的方法,但是我试了下不可以,可能是因为,程序先执行load的吧。

$.ajaxSetup是全局的,在load方法之前设置,就可以了。

本文来自: 解决JQuery中load方法在ie里的缓存问题

Adobe Flash Builder 4 Premium 正式版下载地址+序列号

<Category: flash> 2 条评论

http://trials.adobe.com/AdobeProducts/FLBR/4/win32/FlashBuilder_4_LS10.exe

 安装序列号: 1424-4008-9664-3602-3439-1711

本文来自: Adobe Flash Builder 4 Premium 正式版下载地址+序列号