前端网页设计的知识要点(补充~)

css

css滑动门

1.1 构造两个元素（如a, span ）, 其中一个元素包含另外一个元素

<a><span>测试</span></a>

1.2 定义a , span 的样式，背景图片, 并使用伪类 hover

a{
background: url("img_url") no-repeat scroll left bottom transparent;
    color: #666666;
    cursor: pointer;
    display: inline-block;
    height: 25px;
    padding-left: 15px; //注意,padding-left的话，background-position也要left
    text-decoration: none;
}a span{

    background: url("img_url") no-repeat scroll right bottom transparent;
    display: inline-block;
    height: 25px;
    line-height: 25px;
    padding-right: 15px; //注意同上

}

css 导航栏目的设计

参考1的一个设计是：
http://www.moondyzone.com/css/285.html
CSS Spirit

javascript

javascript的继承，原型，对象和setInterval

function Dog() {
     
	this.wow = function() {
         
		alert(’Wow’);
   
	}

        this.yelp = function(){
        
        this.wow();
     
}
}
function MadDog() {
    this.yelp = function() {
        var self = this;
        setInterval(function() {
            self.wow();
        }, 500);
    }
}
MadDog.prototype = new Dog();
//for test
var dog = new Dog();
dog.yelp();
var madDog = new MadDog();
madDog.yelp();

JavaScript中的闭包

函数体外是无法读取函数体内定义的属性的

function f1(){
　var n=999;
}
alert(n); // error
//函数内部声明变量的时候，一定要使用var命令。如果不用的话，你实际上声明了一个全局变量！

闭包的作用：一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中

如何读取函数体内的变量呢？就是定义一个内嵌函数，并发挥之

function f1(){
   var n=999;
   function f2(){
　　alert(n);
　}
   return f2;
}
var result=f1();
result(); // 999