Ir para conteúdo
  • 0

[Resolvido] Abrir janela ao Clicar!

Guest L0CK3D

Perguntado por Guest L0CK3D,

 Compartilhar

Pergunta

Guest L0CK3D

Guest L0CK3D

Postado
Postado (editado)

Como faço para Abrir essa Janela

 

f1mRM1w.png

 

quando Clicassem No bonequinho Amarelo ou no 100% Seguro

 

Qfqq0tJ.png

 

Uso o BootStrap

 

 

Essa é a div dessas informações:

 

 

 

<!-- Services Section -->
<div id="services-section" class="text-center">
  <div class="container">
    <div class="section-title wow fadeInDown">
    </div>
    <div class="space"></div>
    <div class="row">
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="200ms"> <i class="fa fa-user-secret"></i>
        <h4><strong>100% Seguro</strong></h4>
        <p><b>Todos nossos Serviços são protegidos por FireWalls, e AntiDDOs Físicos, Backups Automáticos Garantem a integrigade de Seus Dados.</b></p>
      </div>
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="400ms"> <i class="fa fa-cart-arrow-down"></i>
        <span style='color:#1E90FF;'><h4><strong>LOJA</strong></h4></span>
        <p><b>Todos Tem direitos a Benefícios, <span style='color:#DAA520'>VIPs</span> Balanceados e Equilibrados com os Demais Players Não somos um Servidor P2W (Pay 2 Win)</b></p>
      </div>
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="600ms"> <i class="fa fa-eye"></i>
        <span style='color:#1E90FF;'><h4><strong>Meta</strong></h4></span>
        <b><p>Ser o melhor Servidor Survival do Brasil, Sem lag e Com Pessoas Talentosas</p></b>
      </div>
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="800ms"> <i class="fa fa-users"></i>
        <h4><strong>EQUIPE</strong></h4>
        <p><b>Nossa Equipe é Totalmente Capacitada com Anos de Experiência em Administração de Servidores</b></p>
      </div>
    </div>
  </div>
</div>

 

 

Editado por L0CK3D
Link para o comentário
Compartilhar em outros sites

12 respostass a esta questão

Posts Recomendados

Naghtrion

Naghtrion

Postado
Postado

Usa:
 

data-toggle="modal" data-target="#myModalID"

 

 

<div id="services-section" class="text-center">
  <div class="container">
    <div class="section-title wow fadeInDown">
    </div>
    <div class="space"></div>
    <div class="row">

      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="200ms">
<div data-toggle="modal" data-target="#myModalID">
<i class="fa fa-user-secret"></i>
        <h4><strong>100% Seguro</strong></h4>
        <p><b>Todos nossos Serviços são protegidos por FireWalls, e AntiDDOs Físicos, Backups Automáticos Garantem a integrigade de Seus Dados.</b></p>
      </div>
</div>
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="400ms"> <i class="fa fa-cart-arrow-down"></i>
        <span style='color:#1E90FF;'><h4><strong>LOJA</strong></h4></span>
        <p><b>Todos Tem direitos a Benefícios, <span style='color:#DAA520'>VIPs</span> Balanceados e Equilibrados com os Demais Players Não somos um Servidor P2W (Pay 2 Win)</b></p>
      </div>
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="600ms"> <i class="fa fa-eye"></i>
        <span style='color:#1E90FF;'><h4><strong>Meta</strong></h4></span>
        <b><p>Ser o melhor Servidor Survival do Brasil, Sem lag e Com Pessoas Talentosas</p></b>
      </div>
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="800ms"> <i class="fa fa-users"></i>
        <h4><strong>EQUIPE</strong></h4>
        <p><b>Nossa Equipe é Totalmente Capacitada com Anos de Experiência em Administração de Servidores</b></p>
      </div>
    </div>
  </div>
</div> 

 

 

Link para o comentário
Compartilhar em outros sites
IChoCraft

IChoCraft

Postado
Postado

Usa:

 

data-toggle="modal" data-target="#myModalID"

 

 

<div id="services-section" class="text-center">
  <div class="container">
    <div class="section-title wow fadeInDown">
    </div>
    <div class="space"></div>
    <div class="row">

      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="200ms">
<div data-toggle="modal" data-target="#myModalID">
<i class="fa fa-user-secret"></i>
        <h4><strong>100% Seguro</strong></h4>
        <p><b>Todos nossos Serviços são protegidos por FireWalls, e AntiDDOs Físicos, Backups Automáticos Garantem a integrigade de Seus Dados.</b></p>
      </div>
</div>
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="400ms"> <i class="fa fa-cart-arrow-down"></i>
        <span style='color:#1E90FF;'><h4><strong>LOJA</strong></h4></span>
        <p><b>Todos Tem direitos a Benefícios, <span style='color:#DAA520'>VIPs</span> Balanceados e Equilibrados com os Demais Players Não somos um Servidor P2W (Pay 2 Win)</b></p>
      </div>
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="600ms"> <i class="fa fa-eye"></i>
        <span style='color:#1E90FF;'><h4><strong>Meta</strong></h4></span>
        <b><p>Ser o melhor Servidor Survival do Brasil, Sem lag e Com Pessoas Talentosas</p></b>
      </div>
      <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="800ms"> <i class="fa fa-users"></i>
        <h4><strong>EQUIPE</strong></h4>
        <p><b>Nossa Equipe é Totalmente Capacitada com Anos de Experiência em Administração de Servidores</b></p>
      </div>
    </div>
  </div>
</div> 

 

 

 

Funciona mesmo ?

Link para o comentário
Compartilhar em outros sites
Naghtrion

Naghtrion

Postado
Postado

Sim

Importo o jquery.js e o bootstrap.js?

<script src="https://code.jquery.com/jquery-2.2.3.min.js" integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo=" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
Link para o comentário
Compartilhar em outros sites
Guest L0CK3D

Guest L0CK3D

Postado
Postado

 

Importo o jquery.js e o bootstrap.js?

<script src="https://code.jquery.com/jquery-2.2.3.min.js" integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo=" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

Sim Para abrir teria que transformar o 100%Seguro em um Tipo de botão não ?

Link para o comentário
Compartilhar em outros sites
Naghtrion

Naghtrion

Postado
Postado

Sim Para abrir teria que transformar o 100%Seguro em um Tipo de botão não ?

não... só colocar o data-toggle e target...

 

aqui funciono...

 

 

 

<!doctype html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>teste</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.2/css/font-awesome.min.css">
    <link href="http://bootswatch.com/flatly/bootstrap.css" rel=stylesheet type="text/css">
    <script src="https://code.jquery.com/jquery-2.2.3.min.js" integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo=" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
</head>
<body>
<div id="services-section" class="text-center">
    <div class="container">
        <div class="row">
            <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="200ms">
                <div data-toggle="modal" data-target="#myModal">
                    <i class="fa fa-user-secret"></i>
                    <h4><strong>100% Seguro</strong></h4>
                    <p><b>Todos nossos Serviços são protegidos por FireWalls, e AntiDDOs Físicos, Backups Automáticos Garantem a integrigade de Seus Dados.</b></p>
                </div>
            </div>
            <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="400ms"> <i class="fa fa-cart-arrow-down"></i>
                <span style='color:#1E90FF;'><h4><strong>LOJA</strong></h4></span>
                <p><b>Todos Tem direitos a Benefícios, <span style='color:#DAA520'>VIPs</span> Balanceados e Equilibrados com os Demais Players Não somos um Servidor P2W (Pay 2 Win)</b></p>
            </div>
            <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="600ms"> <i class="fa fa-eye"></i>
                <span style='color:#1E90FF;'><h4><strong>Meta</strong></h4></span>
                <b><p>Ser o melhor Servidor Survival do Brasil, Sem lag e Com Pessoas Talentosas</p></b>
            </div>
            <div class="col-md-3 col-sm-6 service wow fadeInUp" data-wow-delay="800ms"> <i class="fa fa-users"></i>
                <h4><strong>EQUIPE</strong></h4>
                <p><b>Nossa Equipe é Totalmente Capacitada com Anos de Experiência em Administração de Servidores</b></p>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
                <h4 class="modal-title" id="myModalLabel">Modal title</h4>
            </div>
            <div class="modal-body">
                ...
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>
</body>
</html> 

 

 

Link para o comentário
Compartilhar em outros sites
Visitante
Este tópico está impedido de receber novos posts.
 Compartilhar
Ir para lista de perguntas

  • Quem está navegando   0 membros estão online

    • Nenhum usuário registrado visualizando esta página.
×
×
  • Criar Novo...