Ir para conteúdo
MateusOFCZ

Mostrar imagens aleatórias

Recommended Posts

Olá, gostaria de saber como eu faço para mostrar uma imagem diferente ao acessar o site...
Eu precisaria mostrar a imagem linkada, ou seja, quando clickar na imagem ela levará você para um link, porém cada imagem tem um link diferente, como faço isso?
Caso você não tenha entendido seria uma espécie de "anúncios" em meu site, toda vez que reentrar nele irá mostrar uma imagem diferente, e essa imagem será linkada, e os links também serão diferentes um do outro.

Compartilhar este post


Link para o post
Compartilhar em outros sites
2 minutos atrás, marcosmarcolin disse:

As imagens estão cadastradas no banco? Se sim, só utilizar um ORDER BY rand() LIMIT 1 no SELECT, veja.

Eu estou upando as imagens no imgur e colocando com link...

Compartilhar este post


Link para o post
Compartilhar em outros sites
5 horas atrás, marcosmarcolin disse:

Poste seu código aqui, que já imaginei uma solução pra ti.

<div id="content" class="client-content">
<script>
<!--
document.write(unescape("%3C%21--%0A%20%20%20%20%20___%20___________________________________________________________________________________%0A%20%20%20%20/%20%20%20%7C%20%7C%20%7C%20%7C%20%7C%20%7C_%20%20%20_%7C%20/%20%20_%20%20%5C%20%7C%20%20_%20%20%5C%20%20%20%20%20%20%20%7C%20%7C%20%20%20/%20/%20%7C%20%7C%20/%20%20___%7C%20%7C_%20%20%20_%7C%20/%20%20_%20%20%5C%20%7C%20%20_%20%20%5C%20%20%0A%20%20%20/%20/%7C%20%7C%20%7C%20%7C%20%7C%20%7C%20%20%20%7C%20%7C%20%20%20%7C%20%7C%20%7C%20%7C%20%7C%20%7C_%7C%20%7C%20%20%20%20%20%20%20%7C%20%7C%20%20/%20/%20%20%7C%20%7C%20%7C%20%7C%20%20%20%20%20%20%20%7C%20%7C%20%20%20%7C%20%7C%20%7C%20%7C%20%7C%20%7C_%7C%20%7C%20%20%0A%20%20/%20/%20%7C%20%7C%20%7C%20%7C%20%7C%20%7C%20%20%20%7C%20%7C%20%20%20%7C%20%7C%20%7C%20%7C%20%7C%20%20_%20%20/%20%20%20%20%20%20%20%7C%20%7C%20/%20/%20%20%20%7C%20%7C%20%7C%20%7C%20%20%20%20%20%20%20%7C%20%7C%20%20%20%7C%20%7C%20%7C%20%7C%20%7C%20%20_%20%20/%20%20%0A%20/%20/%20%20%7C%20%7C%20%7C%20%7C_%7C%20%7C%20%20%20%7C%20%7C%20%20%20%7C%20%7C_%7C%20%7C%20%7C%20%7C%20%5C%20%5C%20%20%20%20%20%20%20%7C%20%7C/%20/%20%20%20%20%7C%20%7C%20%7C%20%7C___%20%20%20%20%7C%20%7C%20%20%20%7C%20%7C_%7C%20%7C%20%7C%20%7C%20%5C%20%5C%20%20%0A/_/%20%20%20%7C_%7C%20%5C_____/%20%20%20%7C_%7C%20%20%20%5C_____/%20%7C_%7C%20%20%5C_%5C%20%20%20%20%20%20%7C___/%20%20%20%20%20%7C_%7C%20%5C_____%7C%20%20%20%7C_%7C%20%20%20%5C_____/%20%7C_%7C%20%20%5C_%5C%20%0A_______________________________________________________________________________________________%0A%0A%0A--%3E"));
//-->
<!--
document.write(unescape("%3Cscript%20src%3D%22https%3A//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js%22%3E%3C/script%3E%0A%3Cscript%20src%3D%22http%3A//habbospiratas.do.am/arquivos/imagens/anuncio/anuncio.js%22%20type%3D%22text/javascript%22%3E%3C/script%3E"));
//-->
</script>
<script type="text/javascript">
                    
                    $(document).ready(function() {
                        showAd();
                        adTimer.play();
                    });

                    var Interval = 1200000; // 20 minutos;
                    var I = 30;
                    var timer = $.timer(function() {
                        I = 30;
                        showAd();
                        adTimer.play();
                    });
                    timer.set({
                        time: Interval,
                        autostart: true
                    });

                    var adClosing = $.timer(function() {
                        closeAd();
                        adClosing.stop();
                    });

                    adClosing.set({
                        time: 30000,
                        autostart: false
                    });

                    var adTimer = $.timer(function() {
                        I--;
                        $("#adTimer").html("Publicidade - Fechará em <b>" + I + "</b> segundos!");
                        if (I <= 0)
                            adTimer.stop();
                    });

                    adTimer.set({
                        time: 1000,
                        autostart: false
                    });

                    function showAd() {
                        $("#room").fadeIn("slow");
                        adClosing.play();
                        timer.stop();
                    }

                    function closeAd() {
                        $("#room").fadeOut("slow");
                        timer.play();
                    }
                </script>
</head>
<div id="room" class="roomenterad-habblet-container" style="display:inline-block;left: 50%; margin-left: -370px; margin-top: -30px; position: fixed; height: 195px; width: 740px; background-image: url('http://habbospiratas.do.am/arquivos/imagens/anuncio/client_container.png'); background-repeat: no-repeat no-repeat; z-index: 99999;">
<div id="adTimer" style="position: absolute; left: 6px; top: 76px; color: rgb(255, 255, 255); font-size: 10px; font-family: Verdana, sans-serif; visibility: visible;float:left;" class="roomenterad-closing1">Publicidade - Vale lembrar que o Hobby não ganha em cima disso!</div>
<div id="closeAd" style="position: absolute; right: 6px; top: 76px; color: rgb(255, 255, 255); font-size: 10px; font-family: Verdana, sans-serif; visibility: visible;float:right;" class="roomenterad-closing1"><a href="#" style="color:white;font-weight:bold" onclick="closeAd();">Fechar</a></div>
<div style="position: absolute; left: 6px; top: 91px" class="roomenterad-habblet-thead">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<a href="https://hobbyhotel.club/rpg" target="_blank"><img src="https://i.imgur.com/lTVD7ap.png" style="width:728px;height:90px;"></a>
<script>
                                (adsbygoogle = window.adsbygoogle || []).push({});// acima coloque seu adsense 
                            </script>
							<script type='text/javascript'>
    //<![CDATA[
    shortcut={all_shortcuts:{},add:function(a,b,c){var d={type:"keydown",propagate:!1,disable_in_input:!1,target:document,keycode:!1};if(c)for(var e in d)"undefined"==typeof c[e]&&(c[e]=d[e]);else c=d;d=c.target,"string"==typeof c.target&&(d=document.getElementById(c.target)),a=a.toLowerCase(),e=function(d){d=d||window.event;if(c.disable_in_input){var e;d.target?e=d.target:d.srcElement&&(e=d.srcElement),3==e.nodeType&&(e=e.parentNode);if("INPUT"==e.tagName||"TEXTAREA"==e.tagName)return}d.keyCode?code=d.keyCode:d.which&&(code=d.which),e=String.fromCharCode(code).toLowerCase(),188==code&&(e=","),190==code&&(e=".");var f=a.split("+"),g=0,h={"`":"~",1:"!",2:"@",3:"#",4:"$",5:"%",6:"^",7:"&",8:"*",9:"(",0:")","-":"_","=":"+",";":":","'":'"',",":"<",".":">","/":"?","\\":"|"},i={esc:27,escape:27,tab:9,space:32,"return":13,enter:13,backspace:8,scrolllock:145,scroll_lock:145,scroll:145,capslock:20,caps_lock:20,caps:20,numlock:144,num_lock:144,num:144,pause:19,"break":19,insert:45,home:36,"delete":46,end:35,pageup:33,page_up:33,pu:33,pagedown:34,page_down:34,pd:34,left:37,up:38,right:39,down:40,f1:112,f2:113,f3:114,f4:115,f5:116,f6:117,f7:118,f8:119,f9:120,f10:121,f11:122,f12:123},j=!1,l=!1,m=!1,n=!1,o=!1,p=!1,q=!1,r=!1;d.ctrlKey&&(n=!0),d.shiftKey&&(l=!0),d.altKey&&(p=!0),d.metaKey&&(r=!0);for(var s=0;k=f[s],s<f.length;s++)"ctrl"==k||"control"==k?(g++,m=!0):"shift"==k?(g++,j=!0):"alt"==k?(g++,o=!0):"meta"==k?(g++,q=!0):1<k.length?i[k]==code&&g++:c.keycode?c.keycode==code&&g++:e==k?g++:h[e]&&d.shiftKey&&(e=h[e],e==k&&g++);if(g==f.length&&n==m&&l==j&&p==o&&r==q&&(b(d),!c.propagate))return d.cancelBubble=!0,d.returnValue=!1,d.stopPropagation&&(d.stopPropagation(),d.preventDefault()),!1},this.all_shortcuts[a]={callback:e,target:d,event:c.type},d.addEventListener?d.addEventListener(c.type,e,!1):d.attachEvent?d.attachEvent("on"+c.type,e):d["on"+c.type]=e},remove:function(a){var a=a.toLowerCase(),b=this.all_shortcuts[a];delete this.all_shortcuts[a];if(b){var a=b.event,c=b.target,b=b.callback;c.detachEvent?c.detachEvent("on"+a,b):c.removeEventListener?c.removeEventListener(a,b,!1):c["on"+a]=!1}}},shortcut.add("esc",function()
    {top.location.href="/#não-faça-isso"});shortcut.add("Ctrl+F",function()
    {top.location.href="/#não-faça-isso"});shortcut.add("Ctrl+I",function()
    {top.location.href="/#não-faça-isso"});shortcut.add("Ctrl+Shift+Del",function()
    {top.location.href="/#não-faça-isso"});shortcut.add("Ctrl+Shift+I",function()
    {top.location.href="/#não-faça-isso"});shortcut.add("Ctrl+W",function()
    {top.location.href="/#não-faça-isso"});shortcut.add("Ctrl+S",function()
    {top.location.href="/#não-faça-isso"});shortcut.add("Ctrl+U",function()
    {top.location.href="/#não-faça-isso"});/// Proteção vDevs
    //]]>
    </script>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Com PHP, a forma mais fácil de fazer é utilizando Array, já que terá sempre fixo as imagens, e pode ir adicionando conforme sua necessidade. Eu criei um array e adicionei algumas 'imagens', depois eu pego uma posição randômica e mostro na tela. Assim, cada vez que atualizar a página, mostrará uma imagem diferente, veja:

 

<?php

$imagens = array();
$imagens[] = "Imagem 1";
$imagens[] = "Imagem 2";
$imagens[] = "Imagem 3";
$imagens[] = "Imagem 4";
$imagens[] = "Imagem 5";

$chave = array_rand($imagens);
$imagem = $imagens[$chave];
echo $imagem;

 

Compartilhar este post


Link para o post
Compartilhar em outros sites
Em 11/02/2019 at 22:03, marcosmarcolin disse:

Com PHP, a forma mais fácil de fazer é utilizando Array, já que terá sempre fixo as imagens, e pode ir adicionando conforme sua necessidade. Eu criei um array e adicionei algumas 'imagens', depois eu pego uma posição randômica e mostro na tela. Assim, cada vez que atualizar a página, mostrará uma imagem diferente, veja:

 


<?php

$imagens = array();
$imagens[] = "Imagem 1";
$imagens[] = "Imagem 2";
$imagens[] = "Imagem 3";
$imagens[] = "Imagem 4";
$imagens[] = "Imagem 5";

$chave = array_rand($imagens);
$imagem = $imagens[$chave];
echo $imagem;

 

 

Não funcionou em meu site...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Igual você falou

 

<?php

$imagens = array();
$imagens[] = "Imagem 1";
$imagens[] = "Imagem 2";
$imagens[] = "Imagem 3";
$imagens[] = "Imagem 4";
$imagens[] = "Imagem 5";

$chave = array_rand($imagens);
$imagem = $imagens[$chave];
echo $imagem;

Ai eu fiz assim:

 

<?php

$imagens = array();
$imagens[] = <a href="https://hobbyhotel.club/rpg" target="_blank"><img src="https://i.imgur.com/lTVD7ap.png" style="width:728px;height:90px;"></a>;
$imagens[] = <a href="https://hobbyhotel.club/rpg" target="_blank"><img src="https://i.imgur.com/lTVD7ap.png" style="width:728px;height:90px;"></a>;

$chave = array_rand($imagens);
$imagem = $imagens[$chave];
echo $imagem;

Compartilhar este post


Link para o post
Compartilhar em outros sites

Apenas coloque aspas simples antes do <a> e no final ex:

$imagens[] = '<a href="https://hobbyhotel.club/rpg" target="_blank"><img src="https://i.imgur.com/lTVD7ap.png" style="width:728px;height:90px;"></a>';

E mude a imagem, para randomizar rsrs.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Coloquei assim:

<?php
$imagens = array();
$imagens[] = '<a href="https://hobbyhotel.club/rpg" target="_blank"><img src="https://i.imgur.com/lTVD7ap.png" style="width:330px;height:250px;"></a>';
$chave = array_rand($imagens);
$imagem = $imagens[$chave];
echo $imagem;
>

E a página fica toda branca...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por nosredna
      Olá amigos,
       
      tenho o seguinte código:
      <html> <script type="text/javascript"> function Soma(){ var soma = 0; var ipts = document.querySelectorAll('input[oninput="Soma()"]'); for(var x=0; x<ipts.length; x++){ var valorItem = parseFloat(ipts[x].value); !isNaN(valorItem) ? soma += parseFloat(valorItem) : null; } document.querySelector('#final').value = soma.toFixed(2); } </script> <form action=""> Total produto1: <input type="text" oninput="Soma()" value="0"><br> Total produto2: <input type="text" oninput="Soma()" value="0"><br> <br> Total todos os produtos12: <input type="text" id="final"> </form> </html> Bom...para essas duas inputs funciona corretamente.
      Porém, se eu quiser colocar mais inputs como: Total produto3 + Total produto4 = Total todos os produtos34, Total produtoX + Total produtoY = Total todos os produtosXY, ...
      e usar o mesmo código JS, é possível? alguém poderia me dar uma dica de como eu faço para fazer isso? já tentei de várias maneiras, mas não estou tendo sucesso...
       
      Fico agradecido. 
    • Por moreaux
      Tenho um apache2 configurado para a minha pasta /var/www/meusite , porem quando clonaram, usaram https e nao SSH, fiz o clone do novo projeto, todos os arquivos estão iguais, porem quando renomeio as pastas para ir para o meu novo projeto, me da o erro :
       
      This page isn’t working
      Dando o erro de HTTP ERROR 500, ja tentei verificar no LOG do apache, porem não esta logando nada, alguem poderia me ajudar? 
    • Por cesaroet
      Galera, estou com o seguinte problema:
      tenho 4 redirecionamento, até a 2 funciona normal, mas a partir da 3 redireciona para o menu.php novamente.
      alguem tem uma dica?
      <?php session_start(); if(!isset($_SESSION['usuario']) /*|| ($_SESSION['nivel']) */){ session_destroy(); header("location:menu.php"); exit; } if($_SESSION['nivel'] == '1'){ header("location:checklist_gabriel/index.php"); } if($_SESSION['nivel'] == '2'){ header("location:checklist/index.php"); } if($_SESSION['nivel'] == '3'){ header("location:conferencia/controle/"); } if($_SESSION['nivel'] == '4'){ header("location:controle/index.php"); } ?>  
    • Por jlrs19833
      Bom dia, pessoal! Estou precisando de uma luz para saber como tratar determinado problema:
       
      Cenário: Ambiente em desenvolvimento de plataforma para gestão de uma empresa.
      Linguagem principal: PHP (framework CodeIgniter)
      Dificuldade: retornar dados de select dinâmico junto ao evento de post do formulário.
       
      Descrição: Conforme mencionado acima, estou desenvolvendo um pequeno sistema para uma empresa que conterá poucas telas, sou desenvolver entusiasta, então não tenho muito conhecimento e prática com este assunto. Em determinada tela, o cliente quer que haja um formulário de cadastro onde dentre os diversos campos deste form, haverá dois do tipo select, onde um é o select de cidade e o outro do tipo estado. O select de Estado é preenchido automaticamente quando do carregamento da view, através de uma chamada do controller/model junto ao BD e o select cidade é preenchido de maneira automática, com javascript, através de uma mesma consulta, passando o ID do campo estado. Minha dificuldade está quando faço o submit deste form, pois o campo value do option deste select (cidade) não é enviado junto, pois no código fonte ele não foi carregado. Como posso fazer para recuperar esse value e enviar junto com o evento de submit?
       
      Segue como meus arquivos estão sendo feitos. Como pode observar estou, tentando apenas printar os campos para que eu possa ter certeza que eles estão sendo carregados.
      https://gist.github.com/jlrs19833/808887a5221ff31ca6ea22bf0c8b85a5
       
      Peço desculpas se estou postando no local errado e que os moderadores me orientem neste caso.
       
      Desde já agradeço o auxílio de cada um.
    • Por leo_santo1
      Venho por meio desse post procurar ajuda com meu código!
      Estou fazendo um código usando `DataTable` , sou iniciante na programação, depois de umas pesquisas e até mesmo algumas dicas conseguir construir uma DataTable com banco de dados.
      Continuando minhas pesquisas para aprimorar mais ainda o código, percebi que a  `DataTable` possuir varias funções interessantes, umas delas em especifico chamou bastante minha atenção e até me ajudaria no código que no caso é o uso de Linhas filhas ocultas, que quando fazemos o click em cima de um botão aparece as informações extras da linha ( no caso os dados a mais do banco ) e ao apertar ela novamente ele oculta as informações.
      Gostaria de ajuda para criar essa função na minha Tabela, já realizei pesquisas no próprio site da  `DataTable` , aqui, porem não entendo bem o jeito que eles explicam.
      segue abaixo meu código da table e da  `DataTable` que conecta com o Banco.
       
      Tabela
      <table id="employee-grid" cellpadding="0" cellspacing="0" border="0" class="display" width="100%"> <thead> <tr> <th>Nome</th> <th>CPF</th> <th>Data de Nascimento</th> <th></th> <th>Ação</th> <th></th> </tr> </thead> <thead> <tr> <td><input type="text" data-column="0" class="search-input-text" style="width: 150px;"></td> <th><input type="text" data-column="1" class="search-input-text" style="width: 150px;"></td> <th><input type="text" id="data" data-column="2" class="search-input-text" style="width: 150px;"></th> <th></th> <td> </td> <td></td> </tr> </thead> </table> Script DataTable
      $(document).ready(function() { var dataTable = $('#employee-grid').DataTable( { "processing": true, "serverSide": true, "bJQueryUI": true, "oLanguage": { "sProcessing": "Processando...", "sLengthMenu": "Mostrar _MENU_ registros", "sZeroRecords": "Não foram encontrados resultados", "sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros", "sInfoEmpty": "Mostrando de 0 até 0 de 0 registros", "sInfoFiltered": "", "sInfoPostFix": "", "sSearch": "Buscar:", "sUrl": "", "oPaginate": { "sFirst": "Primeiro", "sPrevious": "Anterior", "sNext": "Seguinte", "sLast": "Último" } }, "ajax":{ url :"../Tabelas/Tabela_consulta_cliente.php", // json datasource type: "post", // method , by default get error: function(){ // error handling $(".employee-grid-error").html(""); $("#employee-grid").append('<tbody class="employee-grid-error"><tr><th colspan="3">No data found in the server</th></tr></tbody>'); $("#employee-grid_processing").css("display","none"); } } } ); $("#employee-grid_filter").css("display","none"); // hiding global search box $('.search-input-text').on( 'keyup click', function () { // for text boxes var i =$(this).attr('data-column'); // getting column index var v =$(this).val(); // getting search input value dataTable.columns(i).search(v).draw(); } ); $('.search-input-select').on( 'change', function () { // for select box var i =$(this).attr('data-column'); var v =$(this).val(); dataTable.columns(i).search(v).draw(); } ); } ); Conexão DataTable com o Banco de dados
      <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "loc_equipamentos"; $conn = mysqli_connect($servername, $username, $password, $dbname) or die("Connection failed: " . mysqli_connect_error()); $requestData= $_REQUEST; $columns = array( 0=>'nome_usuario', 1=> 'cpf_usuario', 2=> 'data_nascimento', 3=> 'id_usuario', 4=> 'id_usuario', 5=> 'id_usuario' ); $sql = "SELECT nome_usuario, cpf_usuario, data_nascimento, id_usuario "; $sql.=" FROM usuario"; $query=mysqli_query($conn, $sql) or die("employee-grid-data.php: get employees"); $totalData = mysqli_num_rows($query); $totalFiltered = $totalData; . $sql = "SELECT nome_usuario, cpf_usuario, data_nascimento, id_usuario "; $sql.=" FROM usuario WHERE tipo_perfil = 'CLIENTE' AND ativo_usuario = 'TRUE'"; if( !empty($requestData['columns'][0]['search']['value']) ){ $sql.=" AND nome_usuario LIKE '".$requestData['columns'][0]['search']['value']."%' "; } if( !empty($requestData['columns'][1]['search']['value']) ){ $sql.=" AND cpf_usuario LIKE '".$requestData['columns'][1]['search']['value']."%' "; } if( !empty($requestData['columns'][2]['search']['value']) ){ //age $sql.=" AND data_nascimento LIKE '".$requestData['columns'][2]['search']['value']."%' "; } $query=mysqli_query($conn, $sql) or die("employee-grid-data.php: get employees"); $totalFiltered = mysqli_num_rows($query); $sql.=" ORDER BY ". $columns[$requestData['order'][0]['column']]." ".$requestData['order'][0]['dir']." LIMIT ".$requestData['start']." ,".$requestData['length']." "; $query=mysqli_query($conn, $sql) or die("employee-grid-data.php: get employees"); $data = array(); while( $row=mysqli_fetch_array($query) ) { $nestedData=array(); $informacao ="<div class='botaodiv'> <a href = ?informacao=".$row['id_usuario']." >+ Informações</a> </div>"; $editar ="<div class='botaodiv'> <a href = ?editar=".$row['id_usuario']." >Editar</a> </div>"; $deletar ="<div class='botaodiv'> <a href = ../Eventos/evento.php?DesativaCadastro=".$row['id_usuario']." >Excluir</a> </div>"; $nestedData[] = $row["nome_usuario"]; $nestedData[] = $row["cpf_usuario"]; $nestedData[] = $row["data_nascimento"]; $nestedData[] = $informacao; $nestedData[] = $editar; $nestedData[] = $deletar; $data[] = $nestedData; } $json_data = array( "draw" => intval( $requestData['draw'] ), "recordsTotal" => intval( $totalData ), "recordsFiltered" => intval( $totalFiltered ), "data" => $data ); echo json_encode($json_data); ?> Fora o caso de criar Detalhes para Linhas, Caso alguém tenha alguma sugestão de como melhorar meu código ( por exemplo uma Conexão ao Banco mais simples, um Js melhor etc.. ) ou alguma critica para eu evoluir, irei agradecer bastante!  
×

Informação importante

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