Jump to content

Search the Community

Showing results for tags 'imagem'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Calendars

  • Comunidade iMasters

Forums

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Web Development
    • HTML e CSS
    • Javascript
    • PHP
    • Ruby
    • Python
    • Java
    • .NET
    • Docker, Kubernets and other environments
    • WordPress
    • Mobile
    • Agile
    • Desenvolvimento de Games
    • Banco de Dados
    • Design and UX
    • Algoritmos & Outras Tecnologias
  • Entretenimento e uso pessoal
    • Segurança & Malwares
    • Geral
    • iMasters's pub

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Found 122 results

  1. Boa noite, time. Eu estou criando um site de quadrinhos e estou querendo colocar as histórias de forma que sejam traduzidas, a ideia é posicionar as div em cima dos balões de textos. eu fiz um modelo que pode ser visto aqui... http://www.sagacomics.com.br/preTeste/ComicView/index2.htm O problema é que as div com os textos, não acompanham o posicionamento da imagem quando a janela não está maximizada, ou seja, se houver alguma redução do tamanho da janela, horizontalmente, ou seja, a imagem acompanha o navegador mais a imagem, não. Uma segunda dúvida, existe alguma forma de deixar o texto alinhado verticalmente dentro da div? os arquivos desse modelo estão em http://www.sagacomics.com.br/preTeste/ComicView/ComicView.rar Obrigado pela ajuda, time.
  2. BrunoHSL

    Fazer apagar imagem anterior

    E ai galera, seguinte estou fazendo um projeto e preciso da ajuda de vocês rs, coloquei uma imagem numa determinada variável e a cada clique no teclado ele movimenta 50px dependendo da onde ele quer movimentar, ele movimenta como quero porém fica ele fica um "rastro" na onde passa, e quero que apague o elemento anterior, afim de dar uma sensação meio de movimento, vou publicar o código aqui e ficaria muito agradecido se pudessem me ajudar, obs : o codigo deve ser feito todo em Javascript... Obrigado desde já. <html> <head> <meta charset='utf-8'> <script> var i, j; var m = []; var x=0; var y=0; var canvas; var ctx; var imagem = new Image(); imagem.src = "link da imagem 2"; var x = 202; var y = 352; function fase1() { canvas = document.getElementById("canvas"); ctx = canvas.getContext("2d"); tabela(); ctx.drawImage(m[7][1],102,102); player(); } function tabela() { canvas = document.getElementById("canvas"); ctx = canvas.getContext("2d"); for (i=0;i<9;i++) { m[i]=[]; } for(i=0;i<9;i++) { for(j=0;j<9;j++) { m[0][0]=ctx.fillStyle="gray"; ctx.fillRect(0,0,50,50); m[0][1]=ctx.fillStyle="lightgray"; ctx.fillRect(50,0,50,50); m[0][2]=ctx.fillStyle="gray"; ctx.fillRect(100,0,50,50); m[0][3]=ctx.fillStyle="lightgray"; ctx.fillRect(150,0,50,50); m[0][4]=ctx.fillStyle="gray"; ctx.fillRect(200,0,50,50); m[0][5]=ctx.fillStyle="lightgray"; ctx.fillRect(250,0,50,50); m[0][6]=ctx.fillStyle="gray"; ctx.fillRect(300,0,50,50); m[0][7]=ctx.fillStyle="lightgray"; ctx.fillRect(350,0,50,50); m[0][8]=ctx.fillStyle="lightgray"; ctx.fillRect(0,50,50,50); m[1][0]=ctx.fillStyle="gray"; ctx.fillRect(50,50,50,50); m[1][1]=ctx.fillStyle="lightgray"; ctx.fillRect(100,50,50,50); m[1][2]=ctx.fillStyle="gray"; ctx.fillRect(150,50,50,50); m[1][3]=ctx.fillStyle="lightgray"; ctx.fillRect(200,50,50,50); m[1][4]=ctx.fillStyle="gray"; ctx.fillRect(250,50,50,50); m[1][5]=ctx.fillStyle="lightgray"; ctx.fillRect(300,50,50,50); m[1][6]=ctx.fillStyle="gray"; ctx.fillRect(350,50,50,50); m[1][7]=ctx.fillStyle="gray"; ctx.fillRect(0,100,50,50); m[1][8]=ctx.fillStyle="lightgray"; ctx.fillRect(50,100,50,50); m[2][0]=ctx.fillStyle="gray"; ctx.fillRect(100,100,50,50); m[2][1]=ctx.fillStyle="lightgray"; ctx.fillRect(150,100,50,50); m[2][2]=ctx.fillStyle="gray"; ctx.fillRect(200,100,50,50); m[2][3]=ctx.fillStyle="lightgray"; ctx.fillRect(250,100,50,50); m[2][4]=ctx.fillStyle="gray"; ctx.fillRect(300,100,50,50); m[2][5]=ctx.fillStyle="lightgray"; ctx.fillRect(350,100,50,50); m[2][6]=ctx.fillStyle="lightgray"; ctx.fillRect(0,150,50,50); m[2][7]=ctx.fillStyle="gray"; ctx.fillRect(50,150,50,50); m[2][8]=ctx.fillStyle="lightgray"; ctx.fillRect(100,150,50,50); m[3][0]=ctx.fillStyle="gray"; ctx.fillRect(150,150,50,50); m[3][1]=ctx.fillStyle="lightgray"; ctx.fillRect(200,150,50,50); m[3][2]=ctx.fillStyle="gray"; ctx.fillRect(250,150,50,50); m[3][3]=ctx.fillStyle="lightgray"; ctx.fillRect(300,150,50,50); m[3][4]=ctx.fillStyle="gray"; ctx.fillRect(350,150,50,50); m[3][5]=ctx.fillStyle="gray"; ctx.fillRect(0,200,50,50); m[3][6]=ctx.fillStyle="lightgray"; ctx.fillRect(50,200,50,50); m[3][7]=ctx.fillStyle="gray"; ctx.fillRect(100,200,50,50); m[3][8]=ctx.fillStyle="lightgray"; ctx.fillRect(150,200,50,50); m[4][0]=ctx.fillStyle="gray"; ctx.fillRect(200,200,50,50); m[4][1]=ctx.fillStyle="lightgray"; ctx.fillRect(250,200,50,50); m[4][2]=ctx.fillStyle="gray"; ctx.fillRect(300,200,50,50); m[4][3]=ctx.fillStyle="lightgray"; ctx.fillRect(350,200,50,50); m[4][4]=ctx.fillStyle="lightgray"; ctx.fillRect(0,250,50,50); m[4][5]=ctx.fillStyle="gray"; ctx.fillRect(50,250,50,50); m[4][6]=ctx.fillStyle="lightgray"; ctx.fillRect(100,250,50,50); m[4][7]=ctx.fillStyle="gray"; ctx.fillRect(150,250,50,50); m[4][8]=ctx.fillStyle="lightgray"; ctx.fillRect(200,250,50,50); m[5][0]=ctx.fillStyle="gray"; ctx.fillRect(250,250,50,50); m[5][1]=ctx.fillStyle="lightgray"; ctx.fillRect(300,250,50,50); m[5][2]=ctx.fillStyle="gray"; ctx.fillRect(350,250,50,50); m[5][3]=ctx.fillStyle="gray"; ctx.fillRect(0,300,50,50); m[5][4]=ctx.fillStyle="lightgray"; ctx.fillRect(50,300,50,50); m[5][5]=ctx.fillStyle="gray"; ctx.fillRect(100,300,50,50); m[5][6]=ctx.fillStyle="lightgray"; ctx.fillRect(150,300,50,50); m[5][7]=ctx.fillStyle="gray"; ctx.fillRect(200,300,50,50); m[5][8]=ctx.fillStyle="lightgray"; ctx.fillRect(250,300,50,50); m[6][0]=ctx.fillStyle="gray"; ctx.fillRect(300,300,50,50); m[6][1]=ctx.fillStyle="lightgray"; ctx.fillRect(350,300,50,50); m[6][2]=ctx.fillStyle="lightgray"; ctx.fillRect(0,350,50,50); m[6][3]=ctx.fillStyle="gray"; ctx.fillRect(50,350,50,50); m[6][4]=ctx.fillStyle="lightgray"; ctx.fillRect(100,350,50,50); m[6][5]=ctx.fillStyle="gray"; ctx.fillRect(150,350,50,50); m[6][6]=ctx.fillStyle="lightgray"; ctx.fillRect(200,350,50,50); m[6][7]=ctx.fillStyle="gray"; ctx.fillRect(250,350,50,50); m[6][8]=ctx.fillStyle="lightgray"; ctx.fillRect(300,350,50,50); m[7][0]=ctx.fillStyle="gray"; ctx.fillRect(350,350,50,50); m[7][1]=document.getElementById("i1"); } } } function player(){ imagem.onload = function(){ ctx.drawImage(imagem, x, y, imagem.width, imagem.height); } document.onkeydown = function(event) { switch(event.which) { case 37: //pra esquerda x = x - 50; break; case 38: //pra cima y = y - 50; break; case 39: //pra direita x = x + 50; break; case 40: //pra baixo y = y + 50; break; } } setInterval(function(){ ctx.drawImage(imagem, x, y, imagem.width, imagem.height); }, 50); } </script> </head> <body onload="fase1()"> <canvas id="canvas" width="400" height="400" style="border: solid 0px black; margin: 0px auto; display: block;"> <img src="link da imagem 1" id="i1"> </canvas> </body> </html> A imagem 1, só deixei ele numa determinada coordenada, pois vou mexer nela depois.
  3. E ai galera, estou com um probleminha aqui, estou fazendo um jogo que quando o player clicar na imagem ela deve desaparecer, e eu não sei como vou fazer essa função, pode ser somente em Javascript, se vocês puderem me ajudar eu agradeceria muito... Vou estar enviando o código abaixo de como esta o projeto até o momento. A intenção é sumir com as imagens cujo id são i1, i2 e i3. <html> <head> <script type="text/javascript"> var x, y; var ctx; var m=[]; var v=[] var i, j; function inicio() { var c=document.getElementById("cnv") ctx=c.getContext("2d"); fundo(); for(i=0;i<20;i++) { m[i]=[]; v[i]=[]; } for(i=0;i<20;i++){ for(j=0;j<20;j++){ m[0][0]=document.getElementById("i1"); m[0][1]=document.getElementById("i2"); m[0][2]=document.getElementById("i3"); }} num1(); } function fundo() { ctx.fillStyle="#000000"; ctx.fillRect(0,0,1300,600); } function num1(){ ctx.drawImage(m[0][0],100,100); ctx.drawImage(m[0][1],200,200); ctx.drawImage(m[0][2],600,525);} </script> </head> <body onload="inicio()"> <canvas id="cnv" width="1300" height="600" style="border: solid 1px black; margin: 0px auto; display: block;"> Navegador sem suporte <img src="link da img 1" id="i1"> <img src="link da img 2" id="i2"> <img src="link da img 3" id="i3"> </canvas> </body> </html>
  4. gust.php

    Imagem do banco para email

    Boa noite pessoal. Criei um template de email que uso em parte do sistema para envio aos usuários. Em um desses e-mails eu pego uma imagem que esta no banco e envio no corpo do e-mail. Envio a imagem assim: <p><img height="50px" width="50px" class="img-circle" src="data:image/jpeg;base64,<?php echo base64_encode($motorista->getFoto()->getFOTO()); ?>" / ></p> No caso, o e-mail que esta recebendo esta mensagem é do gmail, quando abro no PC a imagem não aparece, já quando abro no app do gmail, no celular, a imagem aparece. Alguém saberia me dizer o pq ?
  5. Tenho um arquivo psd com várias layers, cada uma com uma informação diferente, após selecionar uma imagem de uma layer como faço para exportar apenas essa imagem em seu respectivo tamanho sem precisar separar a layer ocultando as outras nem usar o crop para definir a área da imagem?
  6. juninhogpe

    Compartilhamento no Facebook

    Bom dia à todos. Estou com uma dúvida que é a seguinte: Tenho páginas dinâmicas no meu site na categoria de notícias e quando eu copio o link da notícia e posto no Facebook, gostaria que a imagem que está na notícia aparecesse na imagem do mesmo. Já vi alguns sites que fazem isso. Como posso fazer? Desde já agradeço. Att
  7. Boa noite amigos. Estou tentando fazer uma pré-visualização da imagem antes de fazer o upload. Eu até conseguir, porem tem um problema. Código que estou usando: <script language="javascript" type="text/javascript"> function readURL2(input, id) { if (input.files && input.files[0]) { var reader2 = new FileReader(); reader2.onload = function (e) { $('#'+id) .attr('src', e.target.result) ; } reader2.readAsDataURL(input.files[0]); } } </script> <span style="position:relative;top: 15px; overflow: hidden;display: inline-block" class="fileuploadfileupload-exists" data-provides="fileupload"> <a title="{{trans('post.attach-photos')}}" class="btn-file"> <img id="mini_foto_new2" width="35px" height="35px" class="mini_foto" src="themes/frontend/default/assets/images/Camera-icon.png" /> <input type="file" id="post-image-input2" name="image" onchange="readURL2(this,'mini_foto_new2');" /> </a> </span> O botão para fazer o upload e uma imagem de uma câmera fotográfica, após seleciona a imagem para envio, a imagem selecionada fica no lugar da imagem da câmera, até ai tudo bem, porem depois de clicar no botão de enviar a imagem, continua a da imagem selecionada, eu queria que voltasse a ser a imagem da câmera. Alguém tem uma solução?
  8. Tenho um problema em dispositivos móveis que ao rolar a página a imagem de background está se movendo um pouco e, assim, se redimensionando, como pode ser visto em http://www.fisioterapeutacamila.com/my-bootstrap/sobre.html Já tentei várias alternativas css e até javascript mas o problema persiste. .bg-1, .bg-2, .bg-3, .bg-1:after, .bg-2:after, .bg-3:after { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; z-index: 0; } .bg-1 li span, .bg-2 li span, .bg-3 li span { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; color: transparent; background-size: cover; background-position: 50% 50%; background-repeat: none; opacity: 1; z-index: 0; } .bg-1 li span { background-image: url(../images/slide-1.jpg); } .bg-2 li span { background-image: url(../images/slide-3.jpg); } .bg-3 li span { background-image: url(../images/slide-2.jpg); } ol,ul { list-style:none; } html <body> <ul class="bg-2"> <li><span></span></li> </ul> <nav class="navbar"> <div class="container-fluid social-nav"> ... Alguma sugestão?
  9. danersphp

    update imagem de perfil

    Fala galera, tudo bem? Estou aprendendo PHP e certamente o meu problema deve ser simples de resolver, porém Google e amigos não me ajudaram muito. Estou fazendo uma tela de perfil com foto. O upload e display dela está ok. Porém quando altero algum outro dado da página e salvo, a imagem é deletada do banco (ou pelo menos some do banco). Como posso alterar dados nesta tela sem perder a imagem de perfil atual? VALEU! View da tela: <?php foreach($info as $info): ?> <div class="form-group"> <img src="assets/images/perfil/<?php echo $info['foto']; ?>" border="1" class="perfil_pic" /><br /> <input type="file" name="foto" class="btn btn-default add_file" style="float:left;"/> </div> <?php endforeach; ?> Controller da tela: $u = new Usuarios(); if(isset($_POST['nome']) && !empty($_POST['nome'])){ $img = $_FILES['foto']; $email = addslashes($_POST['email']); $senha = base64_encode($_POST['senha']); $nome = addslashes($_POST['nome']); $sobrenome = addslashes($_POST['sobrenome']); $aniversario = addslashes($_POST['aniversario']); $bio = addslashes($_POST['bio']); $u->updatePerfil($img, $email, $senha, $nome, $sobrenome, $aniversario, $bio); Model da tela: public function updatePerfil($pic, $email, $senha, $nome, $sobrenome, $aniversario, $bio){ $id = $_SESSION['fkr']; $url = ''; if (count($pic) > 0) { $tipos = array('image/jpeg','image/jpg','image/png'); if (in_array($pic['type'], $tipos)) { $url = 'perfilatual'; switch($pic['type']){ case 'image/jpeg': case 'image/jpg': $url .= '.jpg'; break; case 'image/png': $url .= '.jpg'; break; } } move_uploaded_file($pic['tmp_name'], 'assets/images/perfil/' . $url); } $sql = "UPDATE usuarios SET foto = '$url', senha = '$senha', email = '$email', nome = '$nome', sobrenome = '$sobrenome', aniversario = '$aniversario', bio = '$bio' WHERE id = '$id'"; $this->db->query($sql); }
  10. Então, esse é meu código com problemas: <div class="menu_pinicio" id="menu"> <nav id="menu"> <ul type="inicio"> <li><a href="index.html">Início</a></li> <li><a href="como_funciona.html">Como Funciona?</a></li> <li><a href="midia.html">Na mídia</a></li> <li><a href="login.html"><img src="_img/entrar.png"></a></li> </ul> </nav> </div> O ultimo item da lista(entrar), eu substituí por uma imagem jpg, porém a imagem não fica centralizada horizontalmente com os outros links... Existe uma solução? Obrigado!
  11. quebrandolink

    dúvida

    boa tarde pessoal, estou criando um site em php onde existem imagens de avatares, porém quando o usuário faz o upload da imagem dele e atualiza a página porém a imagem não se altera, gostaria de saber se existe alguma forma de fazer esta atualização sem que o usuário tenha que limpar o cache do navegador. Desde já agradeço
  12. weslleyaraujo

    Deletar imagem junto com tabela

    Help aqui, por favor? Deleta a tabela normal, meu problema é que nāo consigo fazer com que suma a imagem também, ela sempre continua na pasta photos/ http://pastebin.com/tZiCYjWp
  13. Estou trabalhando em um projeto em que a webcam padrão tira fotos a cada 1 segundo utilizando o JavaCV. Por enquanto ,nesse code, ao clique do botão capturar ele captura uma foto e salva na pasta do programa. Pede-se que o programa salve as fotos em uma determinada pasta selecionada pelo usuário e que a webcam capture fotos a cada 1 segundo. import com.googlecode.javacv.CanvasFrame; import com.googlecode.javacv.OpenCVFrameGrabber; import com.googlecode.javacv.cpp.opencv_core.IplImage; import com.googlecode.javacv.cpp.opencv_highgui; import com.googlecode.javacv.cpp.opencv_highgui.CvCapture; import static com.googlecode.javacv.cpp.opencv_highgui.cvSaveImage; import java.awt.event.KeyEvent; import javax.swing.JOptionPane; OpenCVFrameGrabber grabber = new OpenCVFrameGrabber(0); JOptionPane.showMessageDialog(null, "Aperte a tecla P para parar a gravação"); while(KeyEvent.VK_P){ try{ grabber.start(); IplImage img = grabber.grab(); if(img!=null){ cvSaveImage("image1.jpg", img); } } catch(Exception e){ e.printStackTrace(); } setFocusable(true); setVisible(true); }
  14. thiscosta

    Problema com div

    Boa tarde! Estou com uma problema com o estilo de uma div. Queria fazer uma div com imagens nela, e gostaria que essa div ficasse igual a div com imagens (abaixo do "Quem sou?") do seguinte site: http://editor.wix.com/html/editor/web/renderer/new?siteId=3d9b67f2-8ba2-45f9-832a-bfacfbd306df&metaSiteId=13c470c6-adbf-4635-9bb0-4ec114f2bbd1&editorSessionId=D25DF937-ACA5-4DF2-A6B1-28A42F0DB351 A div que receberia o estilo seria a "<div fotografias" : <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Beatriz Gomes Fotografia</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div class="all"> <div class="fotoback"> <div class="header"> <div class="menuheader"> <center> <ul> <li class="logo"><img src="moldura.png" width="5%" /></li> <li><a href="#">HOME</a></li> <li><span class="span">|</span><a href="#">BIO</a></li> <li><span class="span">|</span><a href="#">FOTOGRAFIAS</a></li> <li><span class="span">|</span><a href="#">CONTATO</a></li> </ul> </center> </div> <div class="foto"> <img src="imagens/LOGOBEATRIZ.png" width="30%" /> </div> </div> </div> <div class="sobre"> <div class="fotoperfil"> <img src="imagens/perfil.jpg" width=""> </div> <div class="textosobre"> <font face="" size="10"> Quem sou?</font><br><hr width="6%"> <p><font face="" size="4" color="black">sfpjsajfsajfiosajfosaijfiosajfoisajfiosajfosajfsajfiosajfisajfio<br> sdóaskfoafosakfopsakfopsafopakfksafopaksf<br>aspfjsajfosajfosajfiosajfosajfiosajfiosajfiosajfosa<br> pfjsaopjfdsajfsajfiopsajfiosa<br>l´sakfopsajfopksafopksaopfksa<br>o´sfjopsajkpfoksafsaopfkspf<br> sfpjsajfsajfiosajfosaijfiosajfoisajfiosajfosajfsajfiosajfisajfio<br> sdóaskfoafosakfopsakfopsafopakfksafopaksf<br>aspfjsajfosajfosajfiosajfosajfiosajfiosajfiosajfosa<br> pfjsaopjfdsajfsajfiopsajfiosa<br>l´sakfopsajfopksafopksaopfksa<br>o´sfjopsajkpfoksafsaopfkspf<br> sfpjsajfsajfiosajfosaijfiosajfoisajfiosajfosajfsajfiosajfisajfio<br> sdóaskfoafosakfopsakfopsafopakfksafopaksf<br>aspfjsajfosajfosajfiosajfosajfiosajfiosajfiosajfosa<br> pfjsaopjfdsajfsajfiopsajfiosa<br>l´sakfopsajfopksafopksaopfksa<br>o´sfjopsajkpfoksafsaopfkspf<br></p></font> </div> <br> </div> <div class="fotografias"> <ul class="lista"> <li><img src="imagens/fotografias/img1.jpg"></li> <li><img src="imagens/fotografias/img2.jpg"></li> <li><img src="imagens/fotografias/img3.jpg"></li> <li><img src="imagens/fotografias/img4.jpg"></li> <li><img src="imagens/fotografias/img5.jpg"></li> <li><img src="imagens/fotografias/img6.jpg"></li> <li><img src="imagens/fotografias/img7.jpg"></li> <li><img src="imagens/fotografias/img8.jpg"></li> <li><img src="imagens/fotografias/img9.jpg"></li> <li><img src="imagens/fotografias/img10.jpg"></li> <li><img src="imagens/fotografias/img11.jpg"></li> <li><img src="imagens/fotografias/img12.jpg"></li> <li><img src="imagens/fotografias/img13.jpg"></li> <li><img src="imagens/fotografias/img14.jpg"></li> <li><img src="imagens/fotografias/img15.jpg"></li> <li><img src="imagens/fotografias/img16.jpg"></li> <li><img src="imagens/fotografias/img17.jpg"></li> <li><img src="imagens/fotografias/img18.jpg"></li> <li><img src="imagens/fotografias/img19.jpg"></li> <li><img src="imagens/fotografias/img20.jpg"></li> </ul> </div> </div> </body> </html> E aqui está meu css: @charset "utf-8"; /* CSS Document */ .all { margin:0 auto; padding:0px; } .header{ position:absolute; top:0; left:0; right:0; background-color: rgba(0,0,0,.5); height:150px } .logo { padding-right:100px; margin-top:50px; } .menu{ float:right; } .menu ul{ border-color:white; } .menu, ul li { list-style:none; display:inline; padding-right:10px; } .menu, ul, li a{ text-decoration:none; color:white; padding-left:0px; padding-top:10px; } .span { padding:50px; font:bold 12px Verdana, Arial, Helvetica; color:#fff; } .fotoback { background-image:url(imagens/01.jpg); width:100%; height:1080px; background-repeat:no-repeat; position:absolute; top:0; left:0; right:0; text-align:center; } .foto { position:relative; top:200px; } .sobre{ position:static; padding-top:1072px; margin:0 auto; } .fotoperfil { margin:0 auto; float:left; } .textosobre { text-align:center; padding-top:50px; } .fotografias { position:static; width:100%; margin:0 auto; overflow:hidden; } .fotografias img { width:300px; float:left; margin:0px; }
  15. EDUARDO DA SILVA SOUZA

    Efeito escurecer em imagem ou background imagem

    Galera, bom dia. Gostaria de fazer um efeito na imagem parecido com esse em CSS: O meu está pobre assim, só com um opacity: Já procurei em todo lugar e não consegui, se alguém puder dar uma luz ai... :)
  16. gelopes

    Histograma de imagem em PHP

    Olá, tenho uma dúvida: Como faria um histograma de uma imagem em PHP, que eu determinasse qual a coordenada da imagem a ser analisada e me retornasse somente duas coisas, quantidade de tons claros e quantidade de tons escuros. Alguma ideia de como poderia fazer isso? Obrigado
  17. lucasramos999

    Imagem no código script não aparece

    Bom dia. Eu quero usar o mesmo efeito de distorção e noise que este site utiliza: https://www.vinylcuts.nyc/issue-03/issue-03-cover/. Percebam que as imagens sofrem distorções programadas, além de um ruído que lembra antigas TVs. É esse mesmo efeito que quero usar, mas quando aplico o endereço das imagens no código, elas não aparecem. Este é o código do site onde as imagens são inseridas. É através desse comando que elas sofrem as distorções e ruídos. var pageData = [{"title":"issue-03-cover","pageType":"standard","bkgndImgPath":"https://assets.vinylcuts.nyc/wp-content/uploads/2016/02/issue03_0000_cover_img00.jpg"}]; Este é o código principal responsável pelos efeitos: https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/vinyl-webgl.js?ver=1.05.11 . O problema é que quando vou inserir as imagens, elas não aparecem. O único comando que parece funcionar é: var pageData = [{"title":"splash","pageType":"splash"}]; Este comando acima está presente na página inicial. Ele é responsável pelos efeitos de listras em 3D. Vejam: https://www.vinylcuts.nyc/show/splash/ . Mas as imagens da logo,background e título que estão inseridas no código, também não aparecem. Qual será o problema? O que tem de errado? Por que não consigo carregar as imagens e ter esse efeito? Abaixo são as bibliotecas principais utilizadas: O plugin que ele utilizou foi baseado em Three.js. Veja: https://github.com/felixturner/bad-tv-shader. Ele utilizou bibliotecas desse plugin e adaptou com novos efeitos através daquele código principal que eu enviei. Eu sei quais são as bibliotecas principais e tal, mas quando vou fazer os testes, as imagens não carregam. O código parece perfeito, mas não tenho ideia do que está gerando esse erro. Este é um código bem resumido pra facilitar o entendimento. Perceba que no fundo só aparece um background escuro com as listras se movimentando em 3D e tem aquela leve distorção. No site original, primeiro aparece esse fundo e depois as imagens são carregadas. Tem um efeito "opacity" também. O que eu quero disso tudo é só conseguir carregar as imagens nesse código. Quem puder me ajudar eu agradeço muito. <!doctype html> <!-- dev test ! --> <html lang="en-US" class="no-js" style="background-color:#000;"> <head> <meta charset="UTF-8"> <!-- LIB --> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/stats.min.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/TweenMax.min.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/ImprovedNoise.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/jquery.min.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/SimplexNoise.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/atutil.js"></script> <!-- THREE --> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/three.min.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/postprocessing/EffectComposer.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/postprocessing/RenderPass.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/postprocessing/ShaderPass.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/postprocessing/MaskPass.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/shaders/CopyShader.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/shaders/FilmShader.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/shaders/RGBShiftShader.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/shaders/VignetteShader.js"></script> <script src="https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/lib/three/shaders/BrightnessContrastShader.js"></script> <link rel='stylesheet' id='hbo_vinyl-css' href='https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/style.css?ver=1.0' media='all' /> <link rel='stylesheet' id='fontAwesome-css' href='https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/font-awesome.min.css?ver=1.0' media='all' /> <link rel='stylesheet' id='svg-css' href='https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/svg.css?ver=1.0' media='all' /> <script type='text/javascript' src='https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/lib/conditionizr-4.3.0.min.js?ver=4.3.0'></script> <script type='text/javascript' src='https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/lib/modernizr-2.7.1.min.js?ver=2.7.1'></script> <script type='text/javascript' src='https://www.vinylcuts.nyc/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script> <script type='text/javascript' src='https://www.vinylcuts.nyc/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1'></script> <link rel="alternate" type="application/json+oembed" href="https://www.vinylcuts.nyc/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.vinylcuts.nyc%2Fshow%2Fsplash%2F" /> <link rel="alternate" type="text/xml+oembed" href="https://www.vinylcuts.nyc/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.vinylcuts.nyc%2Fshow%2Fsplash%2F&format=xml" /> <style type="text/css"> body { background:url(http://wallpaper.ultradownloads.com.br/277228_Papel-de-Parede-Belissima-Paisagem-de-Montanhas_1920x1200.jpg); z-index:6000; } #webgl { } </style> <script> // conditionizr.com // configure environment tests conditionizr.config({ assets: 'https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl', tests: {} }); </script> <script type='text/javascript' src='https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/app-loader.js?ver=1.05.11'></script> <script type='text/javascript' src='https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/site.min.js?ver=1.05.11'></script> </head> <!-- BEGIN Krux Control Tag for "Vinyl Microsite" --> <!-- Source: /snippet/controltag?confid=KNhYNCzS&site=Vinyl%20Microsite&edit=1 --> <script class="kxct" data-id="KNhYNCzS" data-timing="async" data-version="1.9" type="text/javascript"> window.Krux||((Krux=function(){Krux.q.push(arguments)}).q=[]); (function(){ var k=document.createElement('script');k.type='text/javascript';k.async=true; var m,src=(m=location.href.match(/\bkxsrc=([^&]+)/))&&decodeURIComponent(m[1]); k.src = /^https?:\/\/([a-z0-9_\-\.]+\.)?krxd\.net(:\d{1,5})?\//i.test(src) ? src : src === "disable" ? "" : (location.protocol==="https:"?"https:":"http:")+"//cdn.krxd.net/controltag?confid=KNhYNCzS" ; var s=document.getElementsByTagName('script')[0];s.parentNode.insertBefore(k,s); }()); </script> <!-- END Krux Controltag --> <!-- Start of DoubleClick Floodlight Tag: Please do not remove Activity name of this tag: Vinyl URL of the webpage where the tag is expected to be placed: http://www.vinylcuts.nyc This tag must be placed between the <body> and </body> tags, as close as possible to the opening tag. Creation Date: 12/10/2015 --> <script type="text/javascript"> var axel = Math.random() + ""; var a = axel * 10000000000000; document.write('<iframe src="https://1234407.fls.doubleclick.net/activityi;src=1234407;type=hbogen;cat=vinyl0;dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=' + a + '?" width="1" height="1" frameborder="0" style="display:none"></iframe>'); </script> <noscript> <iframe src="https://1234407.fls.doubleclick.net/activityi;src=1234407;type=hbogen;cat=vinyl0;dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=1?" width="1" height="1" frameborder="0" style="display:none"></iframe> </noscript> <!-- End of DoubleClick Floodlight Tag: Please do not remove --> <script> THREE.BadTVShader={uniforms:{tDiffuse:{type:"t",value:null},time:{type:"f",value:0},distortion:{type:"f",value:3},distortion2:{type:"f",value:5},speed:{type:"f",value:.1},rollAmt:{type:"f",value:0}},vertexShader:["varying vec2 vUv;","void main() {","vUv = uv;","gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );","}"].join("\n"),fragmentShader:["uniform sampler2D tDiffuse;","uniform float time;","uniform float distortion;","uniform float distortion2;","uniform float speed;","uniform float rollAmt;","varying vec2 vUv;","vec3 mod289(vec3 x) {"," return x - floor(x * (1.0 / 289.0)) * 289.0;","}","vec2 mod289(vec2 x) {"," return x - floor(x * (1.0 / 289.0)) * 289.0;","}","vec3 permute(vec3 x) {"," return mod289(((x*34.0)+1.0)*x);","}","float snoise(vec2 v)"," {"," const vec4 C = vec4(0.211324865405187, // (3.0-sqrt(3.0))/6.0"," 0.366025403784439, // 0.5*(sqrt(3.0)-1.0)"," -0.577350269189626, // -1.0 + 2.0 * C.x"," 0.024390243902439); // 1.0 / 41.0"," vec2 i = floor(v + dot(v, C.yy) );"," vec2 x0 = v - i + dot(i, C.xx);"," vec2 i1;"," i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0);"," vec4 x12 = x0.xyxy + C.xxzz;"," x12.xy -= i1;"," i = mod289(i); // Avoid truncation effects in permutation"," vec3 p = permute( permute( i.y + vec3(0.0, i1.y, 1.0 ))"," + i.x + vec3(0.0, i1.x, 1.0 ));"," vec3 m = max(0.5 - vec3(dot(x0,x0), dot(x12.xy,x12.xy), dot(x12.zw,x12.zw)), 0.0);"," m = m*m ;"," m = m*m ;"," vec3 x = 2.0 * fract(p * C.www) - 1.0;"," vec3 h = abs(x) - 0.5;"," vec3 ox = floor(x + 0.5);"," vec3 a0 = x - ox;"," m *= 1.79284291400159 - 0.85373472095314 * ( a0*a0 + h*h );"," vec3 g;"," g.x = a0.x * x0.x + h.x * x0.y;"," g.yz = a0.yz * x12.xz + h.yz * x12.yw;"," return 130.0 * dot(m, g);","}","void main() {","vec2 p = vUv;","float ty = time*speed;","float yt = p.y - ty;","float offset = snoise(vec2(yt*3.0,0.0))*0.2;","offset = offset*distortion * offset*distortion * offset;","offset += snoise(vec2(yt*50.0,0.0))*distortion2*0.001;","gl_FragColor = texture2D(tDiffuse, vec2(fract(p.x + offset),fract(p.y-rollAmt) ));","}"].join("\n")};var GalleryPage=function(){var a,b,c,d,e,f=this;this.init=function(g){f.data=g,f.holder=new THREE.Object3D;var h=new THREE.TextureLoader;h.crossOrigin="";var i=new THREE.Texture;i=h.load(g.bkgndImgPath),i.minFilter=THREE.LinearFilter,i.maxFilter=THREE.LinearFilter,d=new THREE.MeshBasicMaterial({map:i,transparent:!0,opacity:0});var j=new THREE.PlaneGeometry(VinylBkgndConfig.BKGND_W/2,VinylBkgndConfig.BKGND_H,1,1);a=new THREE.Mesh(j,d),f.holder.add(a);var k=new THREE.Texture;k=h.load(g.textImgPath),k.minFilter=THREE.LinearFilter,k.maxFilter=THREE.LinearFilter,e=new THREE.MeshBasicMaterial({map:k,transparent:!0,opacity:0});var l=new THREE.PlaneGeometry(VinylBkgndConfig.BKGND_W/2,VinylBkgndConfig.BKGND_H,1,1);b=new THREE.Mesh(l,e),f.holder.add(b),b.position.z=-1,"right"===g.textSide?(a.position.x=-VinylBkgndConfig.BKGND_W/4,b.position.x=VinylBkgndConfig.BKGND_W/4):(a.position.x=VinylBkgndConfig.BKGND_W/4,b.position.x=-VinylBkgndConfig.BKGND_W/4),c=b.position.x},this.show=function(){TweenMax.to(d,.5,{opacity:1,delay:.5}),TweenMax.to(e,.5,{opacity:1,delay:.5}),b.visible=!1;var a=1;TweenMax.delayedCall(a,function(){b.visible=!0}),TweenMax.fromTo(b.position,.7,{x:-VinylBkgndConfig.BKGND_H/2+c,y:-VinylBkgndConfig.BKGND_H/2},{x:c,y:0,ease:Power2.easeOut,delay:a})},this.hide=function(){TweenMax.to(d,.5,{opacity:0}),TweenMax.to(e,.5,{opacity:0})},this.update=function(){}},Page=function(){var a,b,c=this;this.init=function(d){c.data=d,c.holder=new THREE.Object3D;var e=new THREE.TextureLoader;e.crossOrigin="";var f=new THREE.Texture;f=e.load(d.bkgndImgPath,function(){c.imageLoadCallback&&c.imageLoadCallback()}),f=e.load(d.bkgndImgPath),f.minFilter=THREE.LinearFilter,f.maxFilter=THREE.LinearFilter,b=new THREE.MeshBasicMaterial({map:f,transparent:!0,opacity:0});var g=new THREE.PlaneGeometry(VinylBkgndConfig.BKGND_W,VinylBkgndConfig.BKGND_H,1,1);a=new THREE.Mesh(g,b),c.holder.add(a)},this.show=function(){TweenMax.to(b,.5,{opacity:1,delay:.5})},this.hide=function(){TweenMax.to(b,.5,{opacity:0})},this.update=function(){}},RainbowPage=function(){var a=this,b=[539184,1850635,3160610,1648689,2106168,3612728,3349542,3089937,3221772,1784842,539184],c=[],d=[];this.init=function(e){a.data=e,a.holder=new THREE.Object3D,a.holder.visible=!1;var f=VinylBkgndConfig.BKGND_W/b.length,g=new THREE.PlaneGeometry(f,3*VinylBkgndConfig.BKGND_H,1,1),h=new THREE.Object3D;a.holder.add(h),h.rotation.x=.55,h.position.z=-200;var i=1.5;h.scale.set(i,i,i),$.each(b,function(a,b){var d=new THREE.MeshBasicMaterial({color:b}),e=new THREE.Mesh(g,d);h.add(e),c.push(e),e.position.x=-VinylBkgndConfig.BKGND_W/2+f/2+f*a});var j=new THREE.TextureLoader;j.crossOrigin="Anonymous";for(var k=1;4>k;k++){var l=new THREE.Texture;l=j.load(e["textImgPath"+k]),l.minFilter=THREE.LinearFilter,l.maxFilter=THREE.LinearFilter;var m=new THREE.MeshBasicMaterial({map:l,transparent:!0}),n=new THREE.PlaneGeometry(VinylBkgndConfig.BKGND_W,VinylBkgndConfig.BKGND_H,1,1),o=new THREE.Mesh(n,m);a.holder.add(o),o.position.z=k,d.push(o)}},this.show=function(){var b=.6;TweenMax.delayedCall(b,function(){a.holder.visible=!0}),$.each(c,function(a,c){var d=b+.1*a;TweenMax.killTweensOf(c.position),c.position.y=3*-VinylBkgndConfig.BKGND_H,TweenMax.to(c.position,2,{y:0,ease:Power2.easeOut,delay:d})}),$.each(d,function(a,b){b.material.opacity=1});var e=VinylBkgndConfig.BKGND_H;TweenMax.fromTo(d[0].position,.7,{x:e,y:-e},{x:0,y:0,ease:Power2.easeOut,delay:2}),TweenMax.fromTo(d[1].position,.7,{x:-e,y:-e},{x:0,y:0,ease:Power2.easeOut,delay:2.5}),TweenMax.fromTo(d[2].position,.7,{x:e,y:-e},{x:0,y:0,ease:Power2.easeOut,delay:3}),setTimeout(function(){$("#webgl").on("click",a.onClick),$("#webgl").css("cursor","pointer"),$("#playlist div.page-inner").css("cursor","pointer")},3e3)},this.onClick=function(){$.each(d,function(a,b){TweenMax.to(b.material,.3,{opacity:0})}),$("#webgl").off("click",a.onClick),$("#webgl").css("cursor","default"),console.log("done")},this.hide=function(){a.holder.visible=!1,$("#webgl").off("click",a.onClick),$("#webgl").css("cursor","default")},this.update=function(){}},SplashPage=function(){var a,b,c,d,e,f,g,h,i,j,k,l=this,m=0,n=1e3,o=1e3,p=new THREE.Geometry,q=.0015,r=0,s=1.1,t=[],u=30,v=50,w=new THREE.Geometry;this.init=function(m){l.data=m,l.holder=new THREE.Object3D;var q=new THREE.TextureLoader;q.crossOrigin="Anonymous";var r=new THREE.Texture;r=q.load("https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/img/bkgnd.jpg"),r.minFilter=THREE.LinearFilter,r.maxFilter=THREE.LinearFilter,c=new THREE.MeshBasicMaterial({map:r,transparent:!0,blending:THREE.AdditiveBlending,opacity:0});var s=new THREE.PlaneGeometry(VinylBkgndConfig.BKGND_W,VinylBkgndConfig.BKGND_H,1,1);a=new THREE.Mesh(s,c),l.holder.add(a);var x=new THREE.Texture;x=q.load("https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/img/logo.jpg",function(){l.imageLoadCallback&&l.imageLoadCallback()}),x.minFilter=THREE.LinearFilter,x.maxFilter=THREE.LinearFilter,d=new THREE.MeshBasicMaterial({map:x,transparent:!0,blending:THREE.AdditiveBlending});var y=new THREE.PlaneGeometry(VinylBkgndConfig.BKGND_W,VinylBkgndConfig.BKGND_H,1,1);b=new THREE.Mesh(y,d),l.holder.add(b),b.position.z=1,b.position.y=-VinylBkgndConfig.BKGND_H;var z=new THREE.Texture;z=q.load("https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/img/sub01.png"),z.minFilter=THREE.LinearFilter,z.maxFilter=THREE.LinearFilter,e=new THREE.MeshBasicMaterial({map:z,transparent:!0,blending:THREE.AdditiveBlending,opacity:0});var A=new THREE.PlaneGeometry(586,26,1,1),B=new THREE.Mesh(A,e);l.holder.add(B),B.position.z=1,B.position.y=150;var C=new THREE.Texture;C=q.load("https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/img/sub02.png"),C.minFilter=THREE.LinearFilter,C.maxFilter=THREE.LinearFilter,f=new THREE.MeshBasicMaterial({map:C,transparent:!0,blending:THREE.AdditiveBlending,opacity:0});var D=new THREE.PlaneGeometry(214,26,1,1),E=new THREE.Mesh(D,f);l.holder.add(E),E.position.z=1,E.position.y=-150,h=new THREE.Group,l.holder.add(h),h.position.z=-500;var F=q.load("https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/img/particle.png");i=new THREE.PointsMaterial({map:F,blending:THREE.AdditiveBlending,depthTest:!1,transparent:!0,size:10,opacity:0});for(var G,H=0;n>H;H++)G=ATUtil.randomVector3(o),G.initPos=Math.random(),p.vertices.push(G);g=new THREE.Points(p,i),g.sortParticles=!1,l.holder.add(g),h.add(g);var I=q.load("https://www.vinylcuts.nyc/wp-content/themes/hbo_vinyl/_/js/vinyl-webgl/img/dot.png");j=new THREE.PointsMaterial({size:300,vertexColors:!0,opacity:0,map:I,blending:THREE.AdditiveBlending,depthTest:!1,transparent:!0});for(var J=[],H=0;v>H;H++)G=ATUtil.randomVector3(o),G.initPos=Math.random(),G.theta=Math.random()*Math.PI*2,G.phi=Math.random()*Math.PI*2,w.vertices.push(G),J[H]=new THREE.Color,J[H].setHSL(Math.random(),.8,.5);w.colors=J,k=new THREE.Points(w,j),k.sortParticles=!1,h.add(k);var K=new THREE.PlaneGeometry(5e3,40,1,1);for(H=0;u>H;++H){var L=new THREE.MeshBasicMaterial({opacity:.04,blending:THREE.AdditiveBlending,depthTest:!1,transparent:!0});L.color=new THREE.Color,L.color.setHSL(Math.random(),1,.5);var M=new THREE.Mesh(K,L);M.doubleSided=!0,M.rotation.x=Math.random()*Math.PI,M.rotation.y=Math.random()*Math.PI,M.rotation.z=Math.random()*Math.PI,h.add(M),t.push(M)}},this.show=function(){TweenMax.to(c,1,{opacity:1,delay:.5}),TweenMax.to(d,1,{opacity:1,delay:.5}),TweenMax.fromTo(b.position,1,{x:-VinylBkgndConfig.BKGND_W/2,y:-VinylBkgndConfig.BKGND_H},{x:0,y:0,ease:Power3.easeOut,delay:1}),TweenMax.to(i,2,{opacity:.8,delay:1});for(var a=0;u>a;++a)TweenMax.fromTo(t[a].material,1,{opacity:0},{opacity:.04,delay:2});TweenMax.to(e,.5,{opacity:1,delay:2.5}),TweenMax.to(f,.5,{opacity:1,delay:3}),TweenMax.to(j,1,{opacity:.04,delay:2.5})},this.hide=function(){TweenMax.to(c,.5,{opacity:0}),TweenMax.to(d,.5,{opacity:0}),TweenMax.to(i,.5,{opacity:0}),TweenMax.to(e,.5,{opacity:0}),TweenMax.to(f,.5,{opacity:0}),TweenMax.to(j,.5,{opacity:0});for(var a=0;u>a;++a)TweenMax.to(t[a].material,.5,{opacity:0});$("#webgl").off("click",l.hide),$("#webgl").css("cursor","default")},this.update=function(){var a=.004;r+=q,h.rotation.y+=a,h.rotation.z+=a/2,m+=s}},VinylBkgndConfig={BKGND_W:1440,BKGND_H:900,HALF_FRAME_RATE:!0},noise=new ImprovedNoise,VinylWebGL=function(){function a(){TweenLite.defaultOverwrite="all",t=window.location.href.indexOf("devmode")>-1,i=new THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight,1,1e4),i.position.z=1e3,j=new THREE.Scene,j.fog=new THREE.Fog(0,0,2e3),n=new THREE.Object3D,n.position.z=415,j.add(n),k=new THREE.WebGLRenderer,k.setPixelRatio(window.devicePixelRatio),k.setSize(window.innerWidth,window.innerHeight),$("#webgl").append(k.domElement),l=new Stats,l.domElement.style.position="absolute",l.domElement.style.top="0px",l.domElement.style.right="0px",t&&$("#webgl").append(l.domElement),d(),$(window).resize(f),f(),b(pageData)}function b(a){$.each(a,function(a,b){var c;"none"===b.pageType?q.push(null):("standard"===b.pageType?c=new Page:"gallery"===b.pageType?c=new GalleryPage:"rainbow"===b.pageType?c=new RainbowPage:"splash"===b.pageType&&(c=new SplashPage),c.init(b),n.add(c.holder),q.push(c))}),TweenMax.fromTo(o.bcPass.uniforms.brightness,1,{value:-1},{value:0}),e(),q[q.length-1].imageLoadCallback=function(){console.log("loaded!"),$("div#loader-curtain").hide()}}function c(a){q[r]&&q[r].hide(),q[a]&&q[a].show(),r=a}function d(){o.renderPass=new THREE.RenderPass(j,i),o.badTVPass=new THREE.ShaderPass(THREE.BadTVShader),o.rgbPass=new THREE.ShaderPass(THREE.RGBShiftShader),o.filmPass=new THREE.ShaderPass(THREE.FilmShader),o.bcPass=new THREE.ShaderPass(THREE.BrightnessContrastShader),m=new THREE.EffectComposer(k),m.addPass(o.renderPass),m.addPass(o.badTVPass),m.addPass(o.rgbPass),m.addPass(o.filmPass),m.addPass(o.bcPass),o.bcPass.renderToScreen=!0,o.badTVPass.uniforms.distortion.value=10.3,o.badTVPass.uniforms.distortion2.value=10.1,o.badTVPass.uniforms.speed.value=1.5,o.rgbPass.uniforms.angle.value=0,o.rgbPass.uniforms.amount.value=.002,o.filmPass.uniforms.sIntensity.value=.4,o.filmPass.uniforms.nIntensity.value=.6,o.filmPass.uniforms.grayscale.value=0}function e(){if(requestAnimationFrame(e),v=!v,(!VinylBkgndConfig.HALF_FRAME_RATE||!v)&&u){l.update(),m.render(.1),p+=.01,o.badTVPass.uniforms.time.value=p,o.filmPass.uniforms.time.value=p;var a=noise.noise(p,0,0);o.rgbPass.uniforms.angle.value=2*Math.PI*a,a=15*Math.pow(a,3),o.badTVPass.uniforms.distortion.value=a,o.badTVPass.uniforms.distortion2.value=a,q[0].update()}}function f(){var a=window.innerWidth,b=window.innerHeight;i.aspect=a/b,i.updateProjectionMatrix(),k.setSize(a,b),m.setSize(a,b);var c;c=i.aspect<s?1:i.aspect/s,n.scale.set(c,c,c),o.filmPass.uniforms.sCount.value=1.5*window.innerHeight}function g(){$("#webgl").css("display","block"),u=!0}function h(){$("#webgl").css("display","none"),u=!1}var i,j,k,l,m,n,o={},p=0,q=[],r=-1,s=VinylBkgndConfig.BKGND_W/VinylBkgndConfig.BKGND_H,t=!1,u=!0,v=!0;return{init:a,showPage:c,show:g,hide:h}}(); </script> <body class="page page-id-1048 page-child parent-pageid-1044 page-template page-template-template-episode-splash page-template-template-episode-splash-php splash" data-color="#ffffff" data-issue="Vinyl " id="vinyl-cuts" style="background-color:#000;"> <script type="text/javascript" src="https://www.hbo.com/html/js/s_code_onsite.js"></script> <script type="text/javascript" src="https://www.hbo.com/html/js/offsite-tracklinks.js"></script> <!-- analytics --> <script type="text/javascript"> var body = document.getElementsByTagName('body')[0]; var device = new MobileDetect(window.navigator.userAgent); var omniture = null; var deviceType = 'desktop'; deviceType = ( device.is('iPad') ) ? 'ipad' : deviceType; deviceType = ( device.is('iPhone') ) ? 'iphone' : deviceType; deviceType = ( device.is('AndroidOS') ) ? 'android' : deviceType; deviceType = ( device.is('Kindle') ) ? 'kindle' : deviceType; var deviceMob = ( device.match('iphone|ipad|android|kindle') ) ? 'yes' : 'no'; var config = { eVar10: 'Vinyl', prop10: 'Vinyl', eVar30: deviceMob, prop30: deviceMob, eVar30: deviceType, prop30: deviceType, eVar50: body.dataset.issue, prop50: body.dataset.issue, pageName: null, eVar1: null, hier1: null }; var omnitureSettings = config; </script> <!-- analytics --> <div id="webgl"></div> <script type="text/javascript"> var pageData = [{"title":"splash","pageType":"splash"}]; </script> <script type="text/javascript">/* <![CDATA[ */(function(d,s,a,i,j,r,l,m,t){try{l=d.getElementsByTagName('a');t=d.createElement('textarea');for(i=0;l.length-i;i++){try{a=l[i].href;s=a.indexOf('/cdn-cgi/l/email-protection');m=a.length;if(a&&s>-1&&m>28){j=28+s;s='';if(j<m){r='0x'+a.substr(j,2)|0;for(j+=2;j<m&&a.charAt(j)!='X';j+=2)s+='%'+('0'+('0x'+a.substr(j,2)^r).toString(16)).slice(-2);j++;s=decodeURIComponent(s)+a.substr(j,m-j)}t.innerHTML=s.replace(/</g,'<').replace(/>/g,'>');l[i].href='mailto:'+t.value}}catch(e){}}}catch(e){}})(document);/* ]]> */</script></body> </html>
  18. rafael f silva

    trocar de imagem com jquery

    pessoal, nesse programa quero que o ao clicar em cada um dos "spans" o próprio "span" fique marcado em verde e, se houver algum outro já marcado em verde, que ele desmarque e volte a ser vermelho. Até aí meu programa funciona. Agora vem o problema: tenho 5 imagens, todas do mapa mundi, mas cada uma tem um continente marcado em cor diferente. desejo que ao clicar no nome do continente a imagem #mapa receba sua imagem correspondente queria saber oq por exatamente onde puis as "????????" para que a imagem ja busque pelo nome do spam que eu cliquei (por exemplo: asia, africa, etc) segue o codigo, desde ja agradeço. <html> <head> <style> span { color: red; text-decoration: underline; } span.active { color: green; text-decoration: underline; } </style> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('span').click(function(){ $('span.active').removeClass("active"); $(this).addClass("active"); $('img#mapa').attr("src", "imagens/" + ????????; }); }); </script> </head> <body> <span> asia </span><br/> <span> america </span><br/> <span> europa </span><br/> <span> asia </span><br/> <span> oceania </span><br/> <img id="mapa" src="imagens/MapaMundi.jpg">; </body> </html>
  19. Galera, boa noite! Sou novo no forum, estou dando uma repaginada no meu site e me deparei com a seguinte situação: <div class="col-xs-2 posdiversosIcones"> <a href="imagens/diversos/evcoc_festaconfraternizacao_2009.jpg" rel="lightbox" title="EV COC - Convite Festa Confraternização, 2009"> <img src="imagens/diversos/evcoc_festaconfraternizacao_2009a.png" class="img-responsive center-block" height="160px" width="160px" border="0"> </a> </div> A imagem que está fazendo a função de um botão tem 160px x 160px, porém a área de clic dela não pega o tamanho total da imagem, a área de clic está somente na metade da imagem, tipo 160px x 80px. A metade de baixo da imagem não sofre ação nenhuma, é como se não fosse uma imagem linkada. Será que fui claro em minha explicação? rsrs Bom, desde já agradeço a ajuda dos colegas.
  20. eronventer

    Problema com acentuação

    Boa tarde. Preciso executar um script diariamente para renomear uma série de imagens, porém algumas delas possuem acentos e ç. Estas acabam gerando erro no script e não funcionando o rename(). Tem uma forma de resolver? Exemplo de nome: 176329_4 napa + camurça preto.jpg Retorno o navegador: 176329_4 napa + camur�a preto.jpg
  21. Rodrigokyo

    ajuda para por uma imagem no captcha php

    ola pessoal eu peguei um codigo captcha esta funcionando certinho o unico problema e que ele ta gerando uma imagem de cor unica eu queria poder eu mesmo colocar um background em jpg com minha imagem alguem sabe como fazer vou mostra o codigo que gera a imagem <?php session_start(); $image = imagecreate(120,30); $codigo = md5(rand()); $letras = substr($codigo,0,6); $fundo = imagecolorallocate($image,255,255,255); //cor do texto $corfonte = imagecolorallocate($image,55,55,55); //cor do background $_SESSION['codigoCaptcha'] = $letras; imagefill($image,0,0,$corfonte); imagettftext($image,20,0,15,25,$fundo,'futura.ttf',$letras); imagejpeg($image); imagedestroy($image); ?> alguem sabe como posso por uma imagem de fundo por esse codigo obrigado
  22. $id= $_GET['id']; $sql_select = mysql_query("SELECT * FROM anuncio WHERE id='$id'"); $result = mysql_fetch_array($sql_select)or die(mysql_error()); $caminho= "uploads/"; $data = $result['data']; $img_princ = $result['img_princ']; $titulo = $result['titulo']; $descricao = $result['descricao']; $imagens = $result['nome']; $img= explode(";", $imagens); $conta=count ($img); echo'<img src="'.$caminho.$img_princ.'" style="cursor: pointer;" onclick="imagem('.$caminho.$img_princ.')" class=" thumbnail" /></div>'; echo"<div id='imagem'>"; echo"</div>"; <script> function imagem(nome){ $('#imagem').html('<img src="'+nome+'">'); } </script> Queria fazer a miniatura aparecer em baixo na div maior, eu sei que o código do onclick ta certo, e a funcão js tambem, o problema é no php, nas variáveis creio eu.
×

Important Information

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