Yole Garden

分类： 前端

  • How Browsers Work

    This article is found when I clear my Evernote in the afternoon, it’s a fantastic story to get known the flow of  how browser render a page, it’s also very help to understand font-side developing in some view. Share this article to blog, hope to find some time to translate it to Chinese.

    ——————-

    The browser’s main functionality

    The browser main functionality is to present the web resource you choose, by requesting it from the server and displaying it on the browser window. The resource is usually an HTML document, but may also be a PDF, image, or other type. The location of the resource is specified by the user using a URI (Uniform resource Identifier).

    The way the browser interprets and displays HTML files is specified in the HTML and CSS specifications. These specifications are maintained by the W3C (World Wide Web Consortium) organization, which is the standards organization for the web.
    For years browsers conformed to only a part of the specifications and developed their own extensions. That caused serious compatibility issues for web authors. Today most of the browsers more or less conform to the specifications. （更多…）

  • Jquery Validation框架

    1. 作用

    jquery.validate是jquery旗下的一个验证框架，借助jquery的优势，我们可以迅速验证一些常见的输入,并且可以自己扩充自己的验证方法，并且对国际化也有很好的支持。

    2. HelloWorld

    说明：需要JQuery版本：1.2.6+

    步骤：

    1， 要导入相应的jQuery.js与jquery.validate.js文件
    <script src=”jquery.js” type=”text/javascript”></script>
    <script src=”jquery.validate.js” type=”text/javascript”>

    2， 在相应的字段上指定验证规则
    名称 *<input type=”text” name=”loginName” class=”required”>
    其中class=”required”代表本字段必须要输入数据

    3， 指定要对表单进行验证
    <script type=”text/javascript”>

    $(function(){

    $(“#testForm”).validate();

    });

    </script>

    （更多…）

  • Velocity 简明教程

    1. 关于本指南
    2. Velocity是什么?
    3. Velocity能为我们做什么？What can Velocity do for me?
      1. The Mud Store example
    4. Velocity模版语言（VTL）:入门Velocity Template Language (VTL): An Introduction
    5. Hello Velocity World!
    6. 注释Comments
    7. 引用References
      1. 变量Variables
      2. 属性Properties
      3. 方法Methods
    8. Formal Reference Notation
    9. Quiet Reference Notation
    10. Getting literal
      1. Currency
      2. Escaping Valid VTL References
    11. Case Substitution
    12. 标识符Directives
      1. Set
      2. 字符串常量String Literals
      3. 条件语句If-Else Statements
        1. Relational and Logical Operators
      4. foreach循环Foreach Loops
      5. 包含Include
      6. 解析Parse
      7. 停止Stop
      8. 宏Velocimacros
    13. Escaping VTL Directives
    14. VTL: Formatting Issues
    15. Other Features and Miscellany
      1. 数学Math
      2. 范围操作符Range Operator
      3. 高级特性Advanced Issues: Escaping and !
      4. Velocimacro Miscellany
      5. 字符串联String Concatenation
    16. 反馈Feedback （更多…）

  • JavaScript闭包

    最近在网上查阅了不少Javascript闭包(closure)相关的资料，写的大多是非常的学术和专业。对于初学者来说别说理解闭包了，就连文字叙述都很难看懂。撰写此文的目的就是用最通俗的文字揭开Javascript闭包的真实面目。
    什么是闭包？
    “官方”的解释是：闭包是一个拥有许多变量和绑定了这些变量的环境的表达式（通常是一个函数），因而这些变量也是该表达式的一部分。 相信很少有人能直接看懂这句话，因为他描述的太学术。其实这句话通俗的来说就是：JavaScript中所有的function都是一个闭包。不过一般来说，嵌套的function所产生的闭包更为强大，也是大部分时候我们所谓的“闭包”。看下面这段代码： （更多…）

  • Jquery Pop Up a layer

    （更多…）

  • css的几个小问题

    1。段落开头空两格

    .con{
    text-indent:2em;//让段落首行宿进两个字符
    }

    2。段落间距
    p {
    margin-top: 15px;
    margin-bottom: 15px;
    }

    3。行居中 （更多…）

  • CSS框架

    不经意间看到的。

    http://www.cnbeta.com/articles/71868.htm

    如果用这些CSS框架来做页面，相比速度会很快吧，而且兼容性 的问题也不用考虑了，别人都写好了。

    很爽，不过，现阶段时间比较少，没有时间研究啊。。

    争取在11月研究下这些框架，属性一门，然后就爽了。哈哈

    YUI的比较喜欢，Yahoo的东西还是不错的，不过为什么现在在中国发展的这么不好。再说吧。

  • margin-top 无效，避开麻烦的margin叠加(margin collapsing)

    问题：

    <div id=”top” style=”height:100px;background-color:#CCC;”></div>
    <div id=”parent” style=”background-color:#F9F; overflow:hidden;”>
    <div id=”child” style=”margin-top:10px; background-color:#99F;”>想实现效果： Chile 与 parent 间有 10px 间距 <br /> 可 margin-top:10px; 后， 是 parent 与 wrap 间有 10px 间距</div><div></div>
    </div>

    暂时解決方法：

    方法一：在父级内部的添加上、下两个空元素。
    有些教科书上将这种方法称为完美的解决方法。但实际当中我们一般不会使用，因为这种方法不仅要多加两个无意义元素标签，对这两个元素还要特别设置CSS使其高度为0。）: （更多…）

  • 框架，框架让我奈你何如

    在以前的开发中，在所接触到的web前端的知识中，印象就是frame就是一坨rubbish。

    最近几天，在这个小项目的一个用户管理的模块中，我采用的一个左边用户信息操作，右边显示操作结果的布局。感觉使用DIV+CSS控制甚是麻烦，主要是控制右边内容的显示和隐藏麻烦，而且采用我的这种方式如果不采用xmlrequest的话，就必须得一次性加载全部内容，如果页面再大些，用户体验会下降。 （更多…）

  • 学习Javascript闭包（Closure）

    闭包（closure）是Javascript语言的一个难点，也是它的特色，很多高级应用都要依靠闭包实现。
    下面就是我的学习笔记，对于Javascript初学者应该是很有用的。
    一、变量的作用域
    要理解闭包，首先必须理解Javascript特殊的变量作用域。
    变量的作用域无非就是两种：全局变量和局部变量。
    Javascript语言的特殊之处，就在于函数内部可以直接读取全局变量。
    var n=999;
    function f1(){
    alert(n);
    }
    f1(); // 999
    另一方面，在函数外部自然无法读取函数内的局部变量。
    function f1(){
    var n=999;
    }
    alert(n); // error
    这里有一个地方需要注意，函数内部声明变量的时候，一定要使用var命令。如果不用的话，你实际上声明了一个全局变量！
    function f1(){
    n=999;
    }
    f1();
    alert(n); // 999 （更多…）