Game

by levchenko_d

HTML

<button id="restart">restart</button>
<div id="dr">
</div>

CSS

body{
    overflow:  hidden;
    background: #34383e;
}

#draggable{
    width: 100px;
    height: 100px;
    background: yellow;
    position: absolute;
}

#dr{
    width: 50px;
    height: 100px;
    position: absolute;
    bottom:0;
    margin: auto;
    color: white;
    z-index: 9999999;
    background:...

JavaScript

$('#dr').css('left', ((document.body.clientWidth/2)-25 )+'px' )

$('#restart').click(function(){
    $('a').remove();
});

function astero(){
    var n = 50
    ,    r = Math.random()
    ,    s = n*r > 25 ? n*r : 25
    ,    l = document.body.clientWidth * r
    ,    a = document.createElement('a');
    
    var H = $('#dr').offset().top;
    
    document.body.appendChild(a);
    
    a.style.width = s + 'px';
    a.style.height = s + 'px';
    a.style.left = l + 'px';
    
    var move = setInterval(function(){
       $(a).animate({top:'+=10'},100);
                
       if(parseInt(a.style.top) > (H+50)){
            $(a).remove();
           clearInterval(move);
        }
    },100);
}

//astero();

setInterval(function(){astero()}, 1500);


function aHit(data){
    var a = $('a');
    
    for(var i=0; i < a.length; i++){
        var l = a[i].offsetLeft
        ,    t = a[i].offsetTop
        ,    s = a[i].offsetWidth;
        
        if(data.left > l && data.left < (l+s) && data.top  > t && data.top < (t+s)){
           a.eq(i).remove();
        }
    }
}

function hit(data){
    var e = $('#draggable')         
    ,    l = e[0].offsetLeft
    ,    t = e[0].offsetTop
    ,    w = 100
    ,    h = 100;
    
    e[0].innerHTML = 'top: '+e[0].offsetTop+ '<br> left: ' + e[0].offsetLeft;
    
    if(data.left > l && data.left < (l+w) && data.top  > t && data.top < (t+h)){
        e.addClass('hit');
        return true;
    } else {
        e.removeClass('hit');
        
        return false;
    }
    
}

function fire(){
    var e = $('#dr')         
    ,    l = e[0].offsetLeft
    ,    t = e[0].offsetTop
    ,    w = 50
    ,    h = 100
    ,    left = ((w/2)+l)
    ,    top = (t+80)
    ,    step = top/50;
    
    var bullet = document.createElement('b');
    
    document.body.appendChild(bullet);
    bullet.className = 'bul';
    bullet.style.left = left+'px' ;
    
    var i = setInterval(function(){
        bullet.style.top = top + 'px';
       ...