首页 > 其他 > 详细

【网络公开课总结】会飞的小鸟,removeClass() 方法从被选元素移除一个或多个类。

时间:2016-10-10 16:18:12      阅读:200      评论:0      收藏:0      [点我收藏+]

removeClass() 方法从被选元素移除一个或多个类。
注释:如果没有规定参数,则该方法将从被选元素中删除所有类。
语法
$(selector).removeClass(class)

参数 class     
可选。规定要移除的 class 的名称。
如需移除若干类,请使用空格来分隔类名。
如果不设置该参数,则会移除所有类。


  var bird = $("#dbird");
  bird.removeClass().addClass(‘direction-‘ + code)
#dbird 的样式不会被移除掉,只会移除掉css类的。

 css

* {
    padding: 0px;
    margin: 0px;
}

body {
    overflow: hidden;
}

#dbird {
    position: absolute;
    width: 206px;
    height: 121px;
}
.direction-37 {
    transform: rotateY(180deg);
}
.direction-38 {
    transform: rotate(-60deg);
}
.direction-40 {
    transform: rotate(60deg);
}

 

js

/// <reference path="jquery-1.10.2.min.js" />

$(function () {
    var bird = $("#dbird");//获取到了小鸟的对象
    var off = bird.offset();//获取到小鸟的方位的对象
    var icount = 10;//小鸟一次移动的位置
    var keyrecord = 39;
    var birdSize = { width: bird.width(), height: bird.height() };//获取到小鸟的大小
    var docSize = { width: $(window).width(), height: $(window).height() };//获取到当前浏览器的高度和宽度
    $(document).keydown(function (event) {//对网页按下键盘的键的时候触发一个事件,event事件源
        var code = event.keyCode;//获取事件源的编码
        if (keyrecord != code) {
            bird.removeClass().addClass(‘direction-‘ + code)
        }
        keyrecord = code;
        switch (code) {
            case 37://左键
                off.left -= icount;
                if (off.left < -birdSize.width) {
                    off.left = docSize.width;
                }
                break;
            case 38://上键
                off.top -= icount;
                if (off.top < -birdSize.height) {
                    off.top = docSize.height;
                }
                break;
            case 39://右键
                off.left += icount;
                if (off.left > docSize.width) {//当小鸟移动到浏览器的最右边的时候,让它回到浏览器的最左边
                    off.left = -birdSize.width;
                }
                break;
            case 40://下键
                off.top += icount;
                if (off.top > docSize.height) {
                    off.top = -birdSize.height;
                }
                break;

        }
        bird.offset(off);//设置小鸟新的方位值
    });
});

 

【网络公开课总结】会飞的小鸟,removeClass() 方法从被选元素移除一个或多个类。

原文:http://www.cnblogs.com/xiaozizi/p/5946142.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!