0

Bom, estou tentando há uns 2 dias fazer o seguinte:

  • Ao clicar no botão de cadastrar, abrir o modal de cadastro, ao clicar no de informações, abrir o mesmo
  • Ao clicar pra voltar, ambos receberão o display none
  • Ao clicar fora deles, ambos receberão display none

Login

Entrar

                <button id="primeiro-acesso-btn" onclick="abreCadastro()">Primeiro Acesso ?</button>
                <button id="cadastrar-novo-btn">Cadastre-se</button>

                <div class="s-modal-wrap" id="modal-info-cadastro" style="background-image: url(images/parallax/home/1.jpg); background-repeat: no-repeat;background-size: cover; display: none;">
                    <div class="s-modal-content">
                        <h3>No MEU CONDOMÍNIO Você terá acesso a:</h3>
                        <ul>
                            <li>Portal do Condomínio 24 horas</li>
                            <li>Emissão de Boletos Bancários atualizados para Impressão e   pagamento da cota condominial.</li>
                            <li>Visualização de cotas condominiais Pendentes</li>
                            <li>Avisos e Comunicados</li>
                            <li>Acesso a Atas de Assembléia | Convenção | Regimento Interno</li>
                            <li>Agenda e Reserva de Espaços</li>
                        </ul>
                        <button><i class="fa fa-arrow-circle-left fa-lg" aria-hidden="true"></i> Voltar</button>
                    </div>
                </div>
                <div class="s-modal-wrap" id="modal-cadastro">
                    <div class="s-modal-content" style="background-image: url(images/parallax/home/1.jpg); background-repeat: no-repeat;background-size: cover; display: none;">
                        <h3>No MEU CONDOMÍNIO Você terá acesso a:</h3>
                        <form>
                            <input type="text" name="nome" required placeholder="Nome" class="form-control input-lg not-dark required email">
                            <input type="text" name="nome-condominio" required placeholder="Condomínio" class="form-control input-lg not-dark required email" style="margin-top: 10px; margin-bottom: 10px;">
                            <input type="password" name="senha" required placeholder="Senha" class="form-control input-lg not-dark required email">
                            <input type="password" name="confirma-senha" required placeholder="Confirme sua senha" class="form-control input-lg not-dark required email" style="margin-top: 10px; margin-bottom: 10px;">
                            <input type="email" name="email" required placeholder="E-mail" class="form-control input-lg not-dark required email">
                            <input type="email" name="confirma-email" required placeholder="Confirme seu E-mail" class="form-control input-lg not-dark required email" style="margin-top: 10px; margin-bottom: 10px;">
                            <button type="submit" class="button button-rounded button-border button-light noleftmargin">Cadastrar</button>
                        </form>
                        <button><i class="fa fa-arrow-circle-left fa-lg" aria-hidden="true"></i> Voltar</button>
                    </div>
                </div>
            </div>

Ficaria muito grato se alguém pudesse me ajudar

1 Resposta 1

1

Amigo, de uma olhada neste fiddle:

https://jsfiddle.net/lossantis/2e1sfkge/10/

Fiz algumas alterações no teu html, pois as duas modais estavam com o css em tags com classes diferentes.

1
  • eu resolvi com JQuery, mas sua resposta tbm funcionou aq :3 muito obrigado man 2/10/2016 às 15:09

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .