How to increase div by clicking link?

2

I have the following situation:
Is it possible to click where it says Section # 3 the div increase 100% and the bottom also stay 100%? And when I clicked on the other links again everything would be normal again ..

PS: What is the clearest is div with iframe inside, ie when I click on Section # 3 the page appears inside the iframe .

    
asked by anonymous 29.04.2015 / 00:01

1 answer

1

Here is an example of how to do this animation using Javascript (without jQuery).

var c = document.getElementById("testeDiv");

c.addEventListener('click',function(){
    var elemento = document.getElementById("section3");
    if(elemento.style.height !== '100%')
        elemento.style.height = '100%';
    else
        elemento.style.height = '10%';
});
body{
    height: 300px;
    
}

#section3{
    background: red;
    height: 150px;
    width: 100%;
}

#testeDiv{
    width: 200px;
    height: 50px;
}
<div id="section3"></div>

<input type="button" id="testeDiv" value="alterar tamanho"/>
    
23.05.2015 / 22:55