Modal com imagens e formulário de comentário de fotos

[Thiago Lino 0]

Olá amigos do imaster forum,

 

Estou com uma dificuldade e queria a ajuda de vocês...

Estive vendo um forma do facebook exibir as suas imagens com um efeito modal e ao lado no mesmo efeito um formulário para comentário da foto.

Tipo assim:

 

 

Eu já uso o shadowbox tem alguma maneira de fazer isso com ele?

Ou tenho que usar um outro método?

 

Espero que tenham entendido:

 

Vou usar isso em galeria de fotos...

 

Agradeçooo..

[rodrigopa 7]

Usando shadowbox acho que criando a página da foto e dos comentários por fora, e depois linkando o shadowbox na página por iframe.

[Thiago Lino 0]

Usando shadowbox acho que criando a página da foto e dos comentários por fora, e depois linkando o shadowbox na página por iframe.

 

olá rodrigo

 

brigadão mano por tentar me ajudar, mas não consegui compreender o que você tentou me explicar..

 

Entendi criar duas páginas, pra fotos e pra comentários; porém

não compreendi a parte de linkar e iframes ???

 

Tem como esclarecer ou algum exemplo, por favor?

[rodrigopa 7]

Então cara, o shadowbox tem uma função que ele mostra uma página por iframe.

 

Aí você criaria, por exemplo, uma página chamada "codigos.php", e nessa página você colocaria a foto que quer mostrar e os comentários, tipo o facebook.

 

Agora em outra página você apenas chamaria com o shadowbox a página "codigos.php" com o efeito modal automático.

 

O código abaixo tá nas instruções no site deles.

 

<a rel="shadowbox[Mixed]" href="codigos.php">iframe</a>

[Thiago Lino 0]

Então cara, o shadowbox tem uma função que ele mostra uma página por iframe.

 

Aí você criaria, por exemplo, uma página chamada "codigos.php", e nessa página você colocaria a foto que quer mostrar e os comentários, tipo o facebook.

 

Agora em outra página você apenas chamaria com o shadowbox a página "codigos.php" com o efeito modal automático.

 

O código abaixo tá nas instruções no site deles.

 

<a rel="shadowbox[Mixed]" href="codigos.php">iframe</a>

 

 

beleza vou tentar aquiii, qualquer coisa volto...

 

 

brigadão aquii

 

só uma duvida por padrão o/ shadowbox já abre um iframe?

[rodrigopa 7]

beleza vou tentar aquiii, qualquer coisa volto...

 

 

brigadão aquii

 

só uma duvida por padrão o/ shadowbox já abre um iframe?

 

Acho que não, mas lê as instruções no site ae.

[Thiago Lino 0]

Acho que não, mas lê as instruções no site ae.

 

Eu tô quase lá mas queria ver contigo tipo, como eu vou passar os parametros tipo id da foto e o id do comentário referente?

 

 

Esse é o index, tá certinho e indo pra página codigo.php, no entanto é como só exibisse uma foto tendeu?

<?php

   mysql_connect("localhost","root","")or die(mysql_error());
   mysql_select_db("face")or die(mysql_error());


?>

<link rel="stylesheet" type="text/css" href="shadowbox.css">
<script type="text/javascript" src="shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init();
</script>


<div class="album">
<?php




   $sqlTitulo = mysql_query("SELECT * FROM fotos")or die(mysql_error());

       while($resul = mysql_fetch_array($sqlTitulo)){
           ?>        
           <h3>Galeria: <?php echo $resul['titulo'];?></h3>
             <?php      
       }
?>

<?php    


     //A quantidade de valor a ser exibida
     $quantidade = 20;
     //a pagina atual
     $pagina     = (isset($_GET['pagina'])) ? (int)$_GET['pagina'] : 1;
     //Calcula a pagina de qual valor será exibido
     $inicio     = ($quantidade * $pagina) - $quantidade;

     //Monta o SQL com LIMIT para exibição dos dados  
     $sql = "SELECT * FROM fotos ORDER BY id DESC LIMIT $inicio, $quantidade";

  //Executa o SQL      
     $qr  = mysql_query($sql) or die(mysql_error());

     //TABELA
     ?>

<?php
     //Percorre os campos da tabela



     while($ln = mysql_fetch_assoc($qr)){


           ?>

           <a href="codigo.php" rel="shadowbox[galeria]">
           <img src="<?php echo $ln['thumb']; ?>" width=100px/>
           </a>
           <?php          


	}
     /**
      * SEGUNDA PARTE DA PAGINAÇÃO
      */

     //SQL para saber o total
     $sqlTotal   = "SELECT id FROM fotos";
     //Executa o SQL
     $qrTotal    = mysql_query($sqlTotal) or die(mysql_error());
     //Total de Registro na tabela
     $numTotal   = mysql_num_rows($qrTotal);
     //O calculo do Total de página ser exibido
     $totalPagina= ceil($numTotal/$quantidade); 
      //link para primeira página
      echo '<div class="pagination"><a href="?pagina=1">Primeira Página</a> - ';
      //loop para mostra a os links da paginação
      for($i = 1; $i <= $totalPagina; $i++){
          if($i == $pagina)
        echo $i;
         else
        echo " <a href=\"?pagina=$i\">$i</a> ";
      }
      //link para ultima página
      echo " - <a href=\"?pagina=$totalPagina\">Última Página</a></div>";

   ?>
</div>

 

 

Esse o codigo.php

 

<style>

div.foto{
   width:300px;
height:600px;
   float:left;
   background:#0099ff;   	
}
div.comentario{
   width:300px;
height:600px;
   float:left;
   background:#ffffff;   	
}

</style>



<div class="foto">



<img src="/opencontrol/sistema/galerias/fotos/<?php echo $ln['foto']; ?>" />




</div>

<div class="comentario">

<?php 




?>

</div>

 

Porque o que eu não tô conseguindo é ligar os comentários a foto.

 

Pois não tô sabendo passar o id da foto.

 

Tem como me dar uma ajudinha ai...? Além da que já deu claro..

 

conseguiii, grosso mais consegui eu vou dar uma ajeitada no código depois posto aqui pra quem quiser ou precisar..

 

 

valeu rodrigo, devo essa a ti mano...

[rodrigopa 7]

Que bom que tá dando certo. Tu faz assim passa os dados por GET para o arquivo codigo.php, lá no href você põe codigo.php?id=VALOR. Ai no arquivo codigo.php você trata as váriáveis.

 

Espero ter sido claro.

[Thiago Lino 0]

Que bom que tá dando certo. Tu faz assim passa os dados por GET para o arquivo codigo.php, lá no href você põe codigo.php?id=VALOR. Ai no arquivo codigo.php você trata as váriáveis.

 

Espero ter sido claro.

 

Totalmente claro mano, valeu mesmo, mas queria mais uma forcinha tua se possivel, tipo, coloquei um formulário pequeninho na parte dos comentários pra o usuário deixar lá o comentário dele e queria tipo que quando ele clicasse no btn enviar, o comentário ser enviado sem sair do shadowbox e automáticamente exibir abaixo, isso pode ser feito com jquery?

 

Ou só em ajax mesmo?

 

sabe me informar alguma coisa sobre isso?

[rodrigopa 7]

Totalmente claro mano, valeu mesmo, mas queria mais uma forcinha tua se possivel, tipo, coloquei um formulário pequeninho na parte dos comentários pra o usuário deixar lá o comentário dele e queria tipo que quando ele clicasse no btn enviar, o comentário ser enviado sem sair do shadowbox e automáticamente exibir abaixo, isso pode ser feito com jquery?

 

Ou só em ajax mesmo?

 

sabe me informar alguma coisa sobre isso?

 

Em jQuery dá pra fazer bem facilmente.

[Thiago Lino 0]

Em jQuery dá pra fazer bem facilmente.

 

Tipo assim tem algum plugin que tu sabe o nome que pode me indicar mano..

 

È que de js eu manjo pouco de mais...

 

Eu queria o seguinte, enviou o comentário, aparece a imagem de carregando e logo em seguida o comentário seja exibido na div abaixo tipo até com um efeito fade, se tiver como claro...

[rodrigopa 7]

Entendi Thiago, tenta ler esse artigo http://www.9lessons.info/2009/09/comment-system-database-with-jquery.html, ele é exatamente o que você está querendo, eu acho.

[Thiago Lino 0]

Entendi Thiago, tenta ler esse artigo http://www.9lessons.info/2009/09/comment-system-database-with-jquery.html, ele é exatamente o que você está querendo, eu acho.

 

 

Wlw a força Rodrigo, brigado aew..

 

Na verdade ele já tá inserindo sem sair do shadowbox e também já mostrando abaixo na div, só que ele dá tipo uma recarregada na página toda tendeu, e vou tentar que ele carregue só parte do código php.

 

vllwlwwwwww