Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

heitor de souza oliveira

abrir div flutuante usando js

Por , em Javascript

Recommended Posts

heitor de souza oliveira    0

heitor de souza oliveira
Postado

preciso abrir uma div flutuante ao clicar em um link, porem preciso passar um codigo que vem por um arrei do bd.

esse é o meu código:

<html>
<head>
<meta charset = "utf-8">
<link rel="stylesheet" type="text/css" href="CSS/CSS.css"/>
<script src="bibliotecas/jquery/external/jquery/jquery.js"type="text/javascript"></script>
<script src="bibliotecas/jquery/jquery-ui.js" type="text/javascript"></script>
<link rel="stylesheet" href="bibliotecas/jquery/jquery-ui.css">
<script type="text/javascript">
function confirmacao(id) {
var resposta = confirm("Deseja remover esse registro?");
if (resposta == true) {
window.location.href = "deletar.php?id="+id;
}
}


</script>
<style>
div.divFlutuante{

display:none;

position:absolute;

top:50%;

left:50%;

;

margin-top:-100px;

padding:10px;

width:300px;

height:200px;

border:1px solid #d0d0d0;

}
</style>

</head>
<body>
<?php
include 'conexao.php';
session_start();
$sql = "SELECT * FROM produto";
$query = mysql_query($sql);
echo "<table border='0'>";
echo "<tr>";

echo "<td><center><b>NOME </b></center></td>";
echo "<td><center><b>UNIDADE</b></center></td>";
echo "<td><center><b>QUANTIDADE</b></center></td>";
echo "<td><center><b>VALOR SAIDA</b></center></td>";
echo "<td><center><b>EXCLUIR</b></center></td>";
echo "<td><center><b>EDITAR</b></center></td>";
echo "<td><center><b>VENDER</b></center></td>";
echo "<td><center><b>PERCA E DOAÇÕES</b></center></td>";
echo "<td><center><b>LANÇAR PRODUTO</b></center></td>";
echo "</tr>";

while ($array = mysql_fetch_array($query)) {
echo "<tr>";
echo "<td>" . $array['nome'] . "</td>";
echo "<td>" . $array['unidade'] . "</td>";
echo "<td>" . $array['qt'] . "</td>";
echo "<td>" . $array['valor_saida'] . "</td>";
?>
<td><a href="javascript:func()" style="text-decoration:none" class="table_campo a_" onclick="confirmacao(<?= $array['codigo']?>)">Excluir</a></td>
<?php
echo "<td><a href='editar.php?codigo=" . $array['codigo'] . "'style='text-decoration:none' class='table_campo a_'>Editar </a></td>";
echo "<td><a href='vender.php?codigo=" . $array['codigo'] . "' style='text-decoration:none' class='table_campo a_'>Vender </a></td>";
echo "<td><a href='doacao.php?codigo=" . $array['codigo'] . "'style='text-decoration:none' class='table_campo a_' >Percas/Doaçoes </a></td>";
?>
<td><a href="javascript:func()" style="text-decoration:none" class="table_campo a_" onclick="codigo(<?= $array['codigo']?>')" >lançar produto</a></td>
<!--<td><a href="#" onclick="document.getElementById('divFlutuante').style.display='block'" style='text-decoration:none' class='table_campo a_'>lançar produto</a></td>-->
<?php
echo "</tr>";
}
?>
</div>
<?php
include 'testando.php';
?>


</body>
</html>


e este é o código testando.php, onde esta a DIV.




<html>

<head>
<meta charset = "utf-8">
<link rel="stylesheet" type="text/css" href="CSS/CSS.css"/>
<script src="bibliotecas/jquery/external/jquery/jquery.js"type="text/javascript"></script>
<script src="bibliotecas/jquery/jquery-ui.js" type="text/javascript"></script>
<link rel="stylesheet" href="bibliotecas/jquery/jquery-ui.css">
<script type="text/javascript">
function confirmacao(id) {
var resposta = confirm("Deseja remover esse registro?");
if (resposta == true) {
window.location.href = "deletar.php?id="+id;
}
}

</script>
<title>Criar uma DIV Flutuante</title>

<style>

#divFlutuante{

display:none;

position:absolute;

top:50%;

left:50%;

;

margin-top:-100px;

padding:10px;

width:300px;

height:300;

border:1px solid #d0d0d0;

background-color: yellow;

z-index: 4000;
}

</style>

</head>

<body>

<div id="divFlutuante">

<a href="#" onclick="document.getElementById('divFlutuante').style.display='none';">[Fechar]</a>

<br />

<?php
include "lancar.php";
?>

</div>



</body>



e este é o código lancar.php:




<html>
<head>
<meta charset = "utf-8">
<link rel="stylesheet" type="text/css" href="CSS/CSS.css"/>
<script src="bibliotecas/jquery/external/jquery/jquery.js"type="text/javascript"></script>
<script src="bibliotecas/jquery/jquery-ui.js" type="text/javascript"></script>
<script src="bibliotecas/mascara.js" type="text/javascript"></script>
<script type="text/javascript" src="bibliotecas/mascaramoney.js" ></script>
<link rel="stylesheet" href="bibliotecas/jquery/jquery-ui.css">
</head>
<body>
<form action = "lancarproduto.php" method = "GET">
<?php
echo "<input type='hidden' name='codigo' value = '$codigo'>";
?>
Quantidade:<br/>
<input type="text" name="quantidade" class="txt borda " required="required"/><br/><br/>
Data:<br/>
<?php
date('Y/m/d');
$data = date('Y/m/d');
echo "<input type='text' name= 'data' value='$data' class='txt borda'/>";
?><br/><br/>
<input type='submit' value='Lancar' class='txt borda' />
</form>
</body>
</html>


preciso que este código venha para a pagina lancar.php, sendo que esta tem que estar aberta dentro da DIV flutuante

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript

  • Conteúdo Similar

    • ILR master
      Fixar div até atingir uma certa altura
      Por ILR master
      Fala pessoal, tudo bem?
       
      Eu tenho o seguinte código:
       
      <script>
         $(function(){
      var jElement = $('.fixar_banner');
      $(window).scroll(function(){
          if ( $(this).scrollTop() > 120 ){
              jElement.css({
                  'position':'fixed',
                  'top':'10px'
              });
          }else{
              jElement.css({
                  'position':'relative',
                  'top':'auto'
              });
          }
      });
      });
      </script>
       
      Porém, eu quero que a div fique fixa até que outro elemento apareça na tela, tipo o rodapé da página por exemplo. É mais ou menos como a página de notícia do uol.
      https://noticias.uol.com.br/internacional/ultimas-noticias/2025/01/19/sonho-americano-brasileiros-moram-em-carro-e-buscam-comida-no-lixo-nos-eua.htm
       
      Espero ter sido claro.
       
      Obrigado :)
       
    • Alessandro Bodão
      H1 que preencha toda a largura da container
      Por Alessandro Bodão
      Fala galerinha, 
       
      Tenho um container com um título (h1) no cabeçalho do meu site, esse container ocupa metade da tela (50vw), e eu gostaria que esse título ocupasse toda a largura desse container, independente do seu tamanho ou do tamanho do monitor, de forma com que a palavra tenha exactamente o mesmo tamanho do container (vou anexar uma foto de exemplo). Já tentei todos os valores pra essa h1, como % e vw... mas nada parece fazer sentido.
       
       

    • Giovanird
      Cor da div conforme o valor do value
      Por Giovanird
      Olá a todos!
      tenho varias divs com o mesmo ID e nome de classe. Preciso que a cor da div seja conforme uma escala de valores.
      Estou tentando pegar o valor pelo nome da classe, pois as divs possuem o mesmo id e não tive sucesso. Segue script:
      <div class="planos" id="1" value="74">74</div> <div class="planos" id="1" value="29">29</div> <div class="planos" id="1" value="55">55</div> <div class="planos" id="1" value="74">74</div> <div class="planos" id="1" value="63">63</div> <div class="planos" id="1" value="55">55</div> <script type="text/javascript"> var valueElement = document.getElementsByClassName('.planos').getAttribute('value'); console.log(valueElement); if (valueElement >= "70") { document.getElementsByClassName('.planos').style.backgroundColor == '#4caf50'; } else if (valueElement >= "50" && valueElement <= "69") { document.getElementsByClassName('.planos').style.backgroundColor == '#ffbc00'; } else { document.getElementsByClassName('.planos').style.backgroundColor == '#f44336'; } </script>  
       
    • GOD
      Div Noticias com RSS
      Por GOD
      Quero um código div ou qualquer outra forma, para atingi esse resultado do link
       https://drive.google.com/file/d/0B8Ssi9zuKdQWMExWeVpGUXN0MlRsUzdmdGRuTFl2eU1yejB3/viewocal
       
      Para ficar nesse local.
      https://drive.google.com/file/d/0B8Ssi9zuKdQWeGZSSnVBaFBxM1FUN1hEeWdrRzhTNWI0Q01Z/view
       
      Meu objetivo é que em cada quadro da div, fique uma noticia de um site especifico, que pretendo colocar através de plugin rss.
       
       
      Enfim espero uma ajuda sobre como posso fazer isso
       
       
    • rcsbnu27
      Página em html, css e javascript
      Por rcsbnu27
      Estou tentando ajudar um amigo a desenvolver seu site pessoal ele me passou um modelo, onde não estou conseguindo fazer um link de menu quando clicar nos anos iniciais ir para as turmas dos anos iniciais no menu atividade educacionais, segue em anexo o código. Endereço para ter ideia do que estou falando: https://www.profrodrigo.com/temporario/index.html. Nesta parte:
      HTML
      <div class="container"> <div class="row"> <div class="col-sm-2"> <a href="#anosiniciais" > <img src="images/anos/anosiniciais.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#anosfinais" > <img src="images/anos/anosfinais.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> </div> </div> </div> </div> </div> <div class="section news-section" id="anosiniciais"> <div class="container"> <div class="row"> <div class="col-sm-2"> <a href="#" target="_blank"> <img src="images/turmas/pres.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#" target="_blank"> <img src="images/turmas/1sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/2sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/3sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/4sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> </div> </div> </div>

      <div class="section news-section" id="anosfinais">
      <div class="container">
      <div class="row">
      <div class="col-sm-2">
      <a href="#">
      <img src="images/turmas/5sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      <div class="col-sm-2">
      <a href="https://www.ebmalbertostein.com" target="_blank">
      <img src="images/turmas/6sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      <div class="col-sm-2">
      <a href="https://www.profgarrido.com" target="_blank">
      <img src="images/turmas/7sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      <div class="col-sm-2">
      <a href="#">
      <img src="images/turmas/8sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      <div class="col-sm-2">
      <a href="#">
      <img src="images/turmas/9sanos.png" class="img-responsive" width="190" height="190" alt="">
      </a>
      </div>
      </div>
      </div>
      </div>
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito