Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <div class="div_grande">
- <?php
- if (!mysqli_set_charset($conn, "utf8")) {
- printf("Error loading character set utf8: %sn", mysqli_error($link));
- exit();
- } else {
- $sql = "SELECT idr, nome, video, img1, img2, img3, img4, img5, img6, telefone, morada, descricao, site FROM restaurantes WHERE fk_lingua = $idl AND fk_distrito = 3";
- }
- $result = $conn->query($sql);
- if ($result->num_rows > 0) {
- // output data of each row
- while($row = $result->fetch_assoc()) {
- $id = $row['idr']; ?>
- <div class="conteudo_cima" id="conteudo_cima">
- <iframe class="img_cima" src="<?php echo $row['video']; ?>" allowfullscreen=1 frameBorder=0></iframe>
- <div class="texto">
- <h1><?php echo $row['nome']."<br>";?></h1>
- <?php echo $row['descricao']."<br>";?>
- <?php echo $row['morada']."<br>";?>
- <?php echo $row['telefone']."<br>";?>
- <a href="http://<?php echo $row['site'];?>" target="_blank"><?php echo $row['site'];?></a>
- </div>
- <div class="seta">
- <img id="trigger" src="imagens/expand.png" onclick="abreInfo(event, <?php echo $id; ?>)">
- </div>
- </div>
- <div class="expand" id="<?php echo $id; ?>">
- <div class="video">
- <iframe src="<?php echo $row['video']; ?>" allowfullscreen=1 frameBorder=0></iframe>
- </div>
- <div class="galeria">
- <div><img src="<?= $row['img1'] ?>" ></div>
- <div><img src="<?= $row['img2'] ?>" ></div>
- <div><img src="<?= $row['img3'] ?>" ></div>
- <div><img src="<?= $row['img4'] ?>" ></div>
- <div><img src="<?= $row['img5'] ?>" ></div>
- <div><img src="<?= $row['img6'] ?>" ></div>
- </div>
- <div class="fundo_expand">
- <div class="texto_expand">
- <h1><?php echo $row['nome']."<br>";?></h1>
- <?php echo $row['descricao']."<br>";?>
- <?php echo $row['morada']."<br>";?>
- <?php echo $row['telefone']."<br>";?>
- <a href="http://<?php echo $row['site'];?>" target="_blank"><?php echo $row['site']."<br><br>";?></a>
- </div>
- <div class="seta_expand">
- <img id="trigger_expand" src="imagens/encolher.png" onclick="abreInfo(event, <?php echo $id; ?>)">
- </div>
- </div>
- </div>
- <?php }
- } else {
- echo "Sem resultados disponíveis!";
- }
- ?>
- </div>
- <script>
- function abreInfo(event, id){
- event.preventDefault();
- $("#"+id).toggle("slow");
- }
- $(document).ready(function(){
- $("#trigger").click(function(){
- $("#conteudo_cima").css("display", "none");
- });
- });
- $(document).ready(function(){
- $("#trigger_expand").click(function(){
- $("#conteudo_cima").css("display", "block");
- });
- });
- </script>
- <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
- <script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
- <script type="text/javascript" src="slick/slick.min.js"></script>
- <script type="text/javascript">
- $('.galeria').slick({
- dots: true,
- infinite: true,
- speed: 1000,
- autoplay:true,
- autoplaySpeed: 1200,
- arrows:true,
- slidesToShow: 1,
- slidesToScroll: 1
- });
- </script>
- .left_corpo .bottom_left_corpo{
- background-color: rgba(0,0,0,0.3);
- height: 75%;
- width: 100%;
- margin-top: 1%;
- }
- .bottom_left_corpo .div_grande{
- position: relative;
- height: 100%;
- width: 100%;
- overflow-y: scroll;
- }
- .div_grande .conteudo_cima{
- text-transform: uppercase;
- color: white;
- font-size: 1vw;
- position: relative;
- height: 30%;
- width: 98%;
- margin-left: 1%;
- margin-top: 1%;
- white-space: nowrap;
- display: block;
- }
- .conteudo_cima .img_cima{
- position: relative;
- display: inline-block;
- height: 100%;
- width: 20%;
- }
- .conteudo_cima .texto{
- /*background-color: red;*/
- position: absolute;
- display: inline-block;
- height: 100%;
- width: 70%;
- margin-left: 0;
- margin-top: 0;
- text-shadow: 1px 1px 1px #000;
- overflow:hidden;
- }
- .conteudo_cima h1{
- font-size: 1.5vw;
- margin-top: 0;
- }
- .conteudo_cima .seta{
- /*background-color: blue;*/
- position: absolute;
- display: inline-block;
- height: 100%;
- width: 10%;
- margin-left: 70%;
- }
- .conteudo_cima .seta #trigger{
- height: 30%;
- width: 50%;
- margin-top: 50%;
- margin-left: 20%;
- cursor: pointer;
- }
- .expand{
- text-transform: uppercase;
- color: white;
- font-size: 1vw;
- position: relative;
- width: 98%;
- margin-left: 1%;
- display: none;
- white-space: nowrap;
- }
- .expand .video{
- position: relative;
- height: 100%;
- width: 40%;
- margin-top: 1%;
- display: inline-block;
- }
- .expand .video iframe{
- height: 200px;
- width: 100%;
- }
- .expand .galeria{
- position: relative;
- height: 100%;
- width: 40%;
- display: inline-block;
- margin-left: 15%;
- }
- .expand .galeria img{
- height: 200px;
- width: 80%;
- margin-left: 10%;
- }
- .expand .fundo_expand{
- position: relative;
- width: 100%;
- white-space: nowrap;
- }
- .expand .texto_expand{
- position: relative;
- height: 100%;
- width: 90%;
- margin-left: 0;
- text-shadow: 2px 2px 2px #000;
- overflow:hidden;
- display: inline-block;
- }
- .expand h1{
- font-size: 1.5vw;
- margin-top: 0;
- }
- .expand .seta_expand{
- position: relative;
- display: inline-block;
- height: 100%;
- width: 10%;
- }
- .expand .seta_expand #trigger_expand{
- height: 30%;
- width: 50%;
- margin-top: 40%;
- margin-left: 11%;
- cursor: pointer;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement