Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

...

HTML
<script>
    var toggleBtn = document.getElementsByClassName('toggleBtn');

    for (var i = 0; i < toggleBtn.length; i++){
        toggleBtn[i].addEventListener('click', toggleContent.bind(null, toggleBtn[i].target));
    }

    function toggleContent(target){
        toggleContentDisplayNone()
        var content = document.getElementById(target);
        if(content.style.display === 'none'){
            content.style.display = 'block';
        }
    }

    function toggleContentDisplayNone(){
        var contents = document.getElementsByClassName('cloak')
        for(var i = 0; i < contents.length; i++){
            if(contents[i].style.display != 'none')
                contents[i].style.display = 'none';
        }
    }
</script>
<style> 
.customBtn {
	border-radius:8px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff !important;
	font-size:16px;
	font-weight:bold;
	padding: 8px 32px;
	text-decoration:none;
	margin: 1px;
	width: 530px;
 	min-width: 50%; 
	max-width: 600px;  
    text-decoration: none;
}

.customBtn:active {
	position:relative;
	top:1px;
}

.btnAzul{
  	background-color:#609af7; 
}

.btnAzul:hover {
	background-color:#4d84db;
	text-decoration: none;
}

.btnVerde{
  	background-color:#38d161;
}

.btnVerde:hover {
	background-color:  #2a9c48;
	text-decoration: none;
}  </style>

...