How to increase div by clicking link?

Asked

Viewed 914 times

2

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

P.S: What’s clearer is a div with iframe inside, that is, when I click on Section #3 the page appears inside the iframe.

javascript html twitter-bootstrap

  • I wrote an answer but I don’t know if it’s the solution you’re looking for. I could post your code?

  • Create an Handler for the click on this element with javascript, ai by the javascript itself you increase the size of the div.

  • post and tell you if it is @Renan , I only have '<a>' in section 3 and div has an embedded iframe and div is composed of 'id="main"' 'id="left"' and 'id="right"'

1 answer

1


Here is an example of how to make 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"/>

Browser other questions tagged javascript html twitter-bootstrap

You are not signed in. Login or sign up in order to post.