Jump to content
presuntou

POP-UP informativo

Recommended Posts

Tenho uma duvida, cabei criando o design de um mapa com os pontos de presença da empresa no mundo, mas não encontrei um meio mais interessante de tornar interativo do que criar popups informativos.

Gostaria de poder colocar o mapa como backgroud, e criar um código que vai fornecer pontos, e ao passar o mouse sobre o ponto ele se abre e aparece alguma informação descrita. No caso quando abrir aparece o nome do nosso datacenter do local.


Existe algum modo simples de fazer isso ? heheh

 

Screenshot_17.png

Share this post


Link to post
Share on other sites

Tooltip

Pode usar o bootstrap se quiser.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By juliosonic
      Boa noite..
      Estou desenvolvendo um site de Reiki https://reikicuritiba.com.br/ e estou com um duvida sobre o menu de navegação da versão mobile.
      O menu que tem o dropdown "Terapeutas" e "Terapias" quando clico em cima ele expande como deve ser, mas quando clico denovo para recolher os submenus
      nao acontece nada.. segue o trecho do codigo do menu..
      <div class="collapse navbar-collapse" id="navbarsExample09">             <ul class="navbar-nav ml-auto">               <li class="nav-item  active"><a class="nav-link" href="index.html">Home</a></li>               <li class="nav-item  active"><a class="nav-link" href="about-us.html">Quem Somos</a></li>               <li class="nav-item dropdown1">                     <a class="nav-link dropdown-toggle" data-toggle="dropdown1" href="#">Terapeutas</a>                     <ul class="dropdown-menu">                         <li><a class="dropdown-item" href="terapeuta-julio-cezar.html">Julio Cezar</a></li>                         <li><a class="dropdown-item" href="terapeuta-pamela-priscila.html">Pamela Priscila</a></li>                     </ul>                                    </li>               <li class="nav-item dropdown">                     <a class="nav-link dropdown-toggle" data-toggle="dropdown1" href="#">Terapias</a>                     <ul class="dropdown-menu" aria-labelledby="dropdown01">                         <li><a class="dropdown-item" href="o-que-e-reiki.html">O que é Reiki</a></li>                         <li><a class="dropdown-item" href="beneficios-reiki.html">Benefícios do Reiki</a></li>                         <li><a class="dropdown-item" href="principios-reiki.html">Princípios do Reiki</a></li>                         <li><a class="dropdown-item" href="animais-reiki.html">Reiki em Animais</a></li>                         <li><a class="dropdown-item" href="animais-reiki.html">Estudos Sobre Reiki</a></li>                         <li><a class="dropdown-item" href="terapia-massagem-tantrica.html">Terapia Tântrica</a></li>                     </ul>               </li>               <li class="nav-item  active"><a class="nav-link" href="blog.html">Blog</a></li>                <li class="nav-item"><a class="nav-link" href="contato.html">Contato</a></li>             </ul>         </div>
              
              
      Obrigado
      Att
      Julio Cezar
    • By Fernando Rafael
      Estou tendo problemas com a leitura de porta serial com PHP, consigo facilmente escrever na mesma, mas sempre que no comando de abertura da porta eu coloco que haverá permissão de leitura o PHP trava e fica carregando infinitamente, e a porta fica bloqueada e só libera quando reiniciado o computador.
       
      Segue o cod:
      exec('MODE COM1:9600,n,8,1'); //seta configuração na porta COM $fp=fopen("COM1","r+b"); if(!$fp) {     echo("Erro ao abrir a porta com1");     exit; } else {         echo("COM1 aberta <br>"); } fwrite($fp,Chr(5));  //escrevendo valor na porta sleep(1); //pausa para retorno dos dados echo (fgets($fp)); fclose($fp); já tentei  colocar:
      fopen("COM1", "r+b");
      fopen("COM1", "r+t");
      fopen("COM1", "r");
      fopen("COM1", "w+");
      fopen("COM1", "r+");
       
      para escrever consigo normal, com o fopen("COM1", "w");.  mas já para ler.....
       
      Notei que na internet tem muito sobre esse problema, inclusive falaram em permissões de usuário, sendo que nos casos em que conseguiram, estavam usando o Linux.
      Eu estou usando o W7 e W10 com PHP 5.2, se for o caso de permissões, como resolvo isso? preciso configurar mais alguma coisa no php.ini?
       
      Também já tentei usar uma classe: phpSerial
       
      Mas retorna o seguinte erro:
      Warning: Reading serial port is not implemented for Windows in C:\Program Files (x86)\Apache Software Foundation\Apache2.2\htdocs\balanca\php_serial.class.php on line 503
       
       
    • By Marxrj
      Olá a todos!,
      Queria aqui uma dica se alguém sabe como alinhar fotos no centro pelo bootstrap.
      Usando o padrão fotos retratos fica como abaixo
      __________  __________
      __________
       
      Mas eu queria que quando tivesse um número impar, a foto não ficasse alinhada na esquerda e sim centralizada como abaixo
      __________  __________
                __________
       
      Estou usando este padrão abaixo aonde ele alinha duas fotos ao lado, mas quando tem somente um ou em número impar, essa não centraliza e sim fica a esquerda.
      <div class="col-xs-12 col-sm-10 col-lg-6 col-md-3">
    • By granderodeo
      <!-------------------------------- PEDIDOS -------------------------> <div class="table-responsive mt-2"> <table class="table table-bordered table-striped text-center"> <thead> <tr> <td colspan="8"> <h4 class="text-center text-info m-0">Pedidos realizados</h4> </td> </tr> <tr> <th>ID pedido</th> <th>Nome cliente</th> <th>E-mail</th> <th>Endereço</th> <th>Número da casa</th> <th>Referência</th> <th>ID cliente</th> </tr> </thead> <tbody> <?php require 'conexao_pedidos.php'; $stmt = $conn->prepare("SELECT * FROM orders"); $stmt->execute(); $result = $stmt->get_result(); $grand_total = 0; while($row = $result->fetch_assoc()): ?> <tr> <td> <?= $row['order_id'] ?></td> <td> <?= $row['order_name'] ?></td> </td> <td><?= $row['order_email'] ?> </td> <td> <?= $row['order_endereco'] ?> </td> <td> <?= $row['order_numero'] ?> </td> <td><?= $row['order_referencia'] ?></td> <td><?= $row['id_usuario'] ?> </td> <td> <button type="button" class="btn btn-danger" data-toggle="modal" data-target="#exampleModal<?= $row['order_id'] ?>"> <i class="fa fa-info-circle"></i> Produtos </button> </td> </tr> <?php endwhile; ?> </tbody> </table> </div> <?php require 'conexao_pedidos.php'; $stmt = $conn->prepare("SELECT * FROM orders"); $stmt->execute(); $result = $stmt->get_result(); $grand_total = 0; while($row = $result->fetch_assoc()): ?> <div class="modal fade" id="exampleModal<?= $row['order_id'] ?>" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Modal title</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <?= $row['order_id'] ?> </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> <?php endwhile; ?>  
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.