Abrindo imagens, páginas e vídeos com jQuery e Shadowbox!

Abrindo imagens, páginas e vídeos com jQuery e Shadowbox!

03/04/2010 | POR Robson V. Leite | 106 Comentários | 1 VISITAS

Saudações meus queridos, vamos com mais uma vídeo aula de Ajax com jQuery. No curso criando um site profissional aprendemos a usar a lightbox 2, que é um plugin do framework prototype.

Nesta vamos ver o plugin Shadowbox, que pode ser usado com qualquer plugin. E vamos usar o jQuery e o SB para abrir vídeos, imagens e páginas com efeito lightbox nesta aula!

Espero que gostem, deixo um grande abraço e o link para os SCRIPTS. Até logo!

106 respostas para “Abrindo imagens, páginas e vídeos com jQuery e Shadowbox!” deixe a sua!
  • Udmar Em: 3 de abril de 2010 as 20:34

    muito legal suas aulas
    aprend muito …vlw

  • Mauro Galvão Em: 3 de abril de 2010 as 20:58

    Cara, mandou bem nessa vídeo aula, muito show. Esse shadowbox é muito flexível. Estava consultando as opções de uso e queria fazer como você fez na vídeo aula só que, quando clicar no link puxar no box o conteúdo de uma DIV, achei lá o comando “content” mas não estou conseguindo fazer desse jeito que te falei, será que tem como?
    Abraço, vlw!

  • Robson V. Leite Em: 3 de abril de 2010 as 21:28

    @Mauro Galvão: Fala querido, é possivel sim, deixo um exemplo pra você!

    <a rel="shadowbox" href="#upinside">Abrir Div</a>
       <div id="upinside" style="display:none;">
          <div id="up_content" style="color:#FFF; padding:10px;">
           Todo conteúdo a mostrar na div da galeria vai aqui!
          </div><!--upinside-->
    </div><!--up_content-->
    
  • Mauro Galvão Em: 3 de abril de 2010 as 22:10

    Muito obrigado Robson, já implementei aqui e está funcionando certinho, “pena” não funcionar no IE 6 e 7. Se você souber de alguma janela modal ou box que puxe conteúdo através de Divs igual esse que foi feito, por favor me indique se puder.

    Abraço!

  • Mauro Galvão Em: 3 de abril de 2010 as 22:12

    Esqueci de falar, o modal ou box que pedi pra indicar tem que funcionar no IE 6 e 7, Vlw!

  • rafa Em: 4 de abril de 2010 as 4:04

    bom e outra coisa que não é nessesario ser em php =d

    eu uzo o lingthbox no meu site

    complexdesigner.hd1.com.br

    Essa samana vo compra minha ospedaguem com a UPINSIDE HOSPEDAGEM DE SITES ja estou desenvolvendu um dinamico aqui

  • Robson V. Leite Em: 4 de abril de 2010 as 10:50

    @Mauro Galvão: Ela funciona no IE6 e 7 meu querido. Só cuide pra não deixar virgula desnecessária na chamada do script! Veja abaixo!

    <script type="text/javascript">
     Shadowbox.init({
     language: 'pt',
     player: ['img', 'html', 'swf'] <!-- AQUI SEM VIRGULA -->
     });
    </script>
    

    Se estiver com virgula o Ie6 e 7 fazem a leitura tentando encontrar outro parâmetro, quando não encontram da o erro! Basta remover a ultima virgula :)

  • Mauro Galvão Em: 4 de abril de 2010 as 12:53

    Eita, essa eu não sabia não rapaz, pior que essa vírgula faz toda a diferença mesmo, funcionou de boa no IE 6 e 7 com a retirada da vírgula. Obrigado pelo esclarecimento da dúvida. :)
    Abraço!

  • Lucas washington Em: 4 de abril de 2010 as 15:25

    Show de bola!

  • CLEVTON FERREIRA Em: 5 de abril de 2010 as 0:52

    CARA ADD ESSE SHADOWBOX PARA CARREGAR UMA PAG EM PHP SÓ Q O FUNDO DAS PÁG TÃO APARECENDO PRETOS E OS LINKS DE TRAIS TÃO SENDO POSSIVEL ACESSAR POR CIMA DA SHADOWBOX MESM.

    ?

  • MARCUS Em: 6 de abril de 2010 as 15:30

    Nossa muito show em robson muito bom entao eu te mandei umas duvidas sobre uma video aula q tu poderia fazer velho tbm sobre o http://highslide.com/ tem com tu fazer um tutorial ensinando a mostrar as fotos etc…

  • Alan Lima Em: 7 de abril de 2010 as 19:39

    Muito Bom!, Show de Bola, tava procurando aprender como era que fazia esse plugin, vc tah me ensinando várias coisas legais ^^, vlw ae, e belo site!

  • Douglas Mailahn Em: 7 de maio de 2010 as 0:31

    Ai Robson agradeço mesmo ai por mais essa dica!

  • Ederton Em: 26 de junho de 2010 as 10:12

    Obrigado Robinson, valeu mesmo!!!

    No meu caso funcionou tudo certinho, só que aparece a seguinte mensagem de erro na barra de status do navegado:

    Mensagem: ‘script.parentNode’ é nulo ou não é um objeto
    Linha: 34
    Caractere: 713
    Código: 0
    URI: http://174.142.97.164/~iagnusb/shadowbox/shadowbox.js

    Para acessa: http://www.edertondesigner.com.br/iagnus

    O que pode ser isso? tem como consertar?

  • Thiago Em: 6 de julho de 2010 as 4:35

    Cara, eu uso o Shadowbox ja faz um tempo.
    Mas ainda não consegui fazer abrir a div =/

    Será porque eu to usando outra base e não jQuery?

    Porque a tela ate escurece, mas nao abre nada =/

  • Afrânio Em: 12 de julho de 2010 as 22:42

    Olá,
    O link do shadowbox está dando pau e não tá dando pra baixar.
    Tem como vc disponibilizar esses arquivos em algum lugar pra baixar?

    Valeu e parabéns!

  • Jerry Em: 12 de agosto de 2010 as 16:59

    Como sempre, suas videos aulas dispensam comentário, são todas excelentes.

  • Roberto Rocha Em: 24 de agosto de 2010 as 17:49

    Comigo aqui não funcionou nada, copiei “exatamente” sua video aula sem mudar nada,não funcionou nem no IE8 e nem no Firefox! .
    Tem algum arquivou ou sei la algum dll no pc que esta faltando e não faz funcionar?

    Abraços

  • João Vítor Carvalho Em: 18 de setembro de 2010 as 10:38

    Grande vídeo aula, isso é ensinar a pescar

  • Ricardo Silva Em: 22 de setembro de 2010 as 16:44

    Funciona no IE 8 sem problemas, só não funciona em IFRAMES ou FRAMES, funciona perfeito com a função $_REQUEST do PHP no IE, aconselho usar a biblioteca JQUERY e SHADOWBOX junto com o site e não On-Line, chamando a função desta maneira:

    Shadowbox.init();

  • Jean Salim Em: 28 de setembro de 2010 as 11:22

    Olá Robson, muito show sua video aula, fiz e funcionou tudo certo, mas estou com um problema no ie8 pois quando abre o site com o efeito da shadowbox, o body não aparece todo na tela portanto se aplciar esse efeito em um link muito embaixo eu tenho que subir na barra de rolagem para visualizar o efeito.

    Já no Firefox e Chrome aparece perfeito, se tiver um link no final da página com o shadowbox, o efeito é carregado exatamente onde está o link, não preciso ir até o topo para visualizar o arquivo.

    Veja de pode me orientar em como alterar o height do body para o ie7 e 8.

  • Jean Salim Em: 29 de setembro de 2010 as 21:58

    Aí Robson essa pergunta que te fiz acima eu já resolvi, agora estou com outra dúvida como acertar os erros de caracteres da paginação das imagens ( Quando colocamos o Vocation, em português nas setas Anterior e Próximo, no próximo está dando erro de acentuação, já pesquisei em tudo e até agora não achei a solução.

    Sabe como resolver isso.

    Obrigado pelo tuto.

  • Eduardo Em: 19 de outubro de 2010 as 19:53

    Fiz da forma que você explicou na vídeo aula e funcionou no FireFox 3.5+ e Internet Explorer 7+!
    Mas no Chrome não está funcionando… Teria alguma coisa que eu possa fazer???

    Shadowbox.init({
    language: ‘pt’,
    player: ['img', 'html', 'swf']
    });

  • Robson V. Leite Em: 21 de outubro de 2010 as 8:47

    @Eduardo: remova a última virgula!

    Shadowbox.init({
    language: ‘pt’,
    player: ['img', 'html', 'swf']
    })

  • filipe Em: 26 de outubro de 2010 as 17:16

    Quero Saber uma Duvida Qual É o Editor de htmls?

  • law Em: 28 de outubro de 2010 as 9:11

    Robson, vc ñ tem noção do galho q me quebrou com esse video. vlw.

  • jadosn torres Em: 30 de outubro de 2010 as 15:00

    Legau de mais esta video aula ensina tudo direito passo a passo gostei mesmo mais

    (((eu gostaria de abri a Shadowbox dentro de uma div específica de meu site isto é possível?
    E como eu faria isto?)))

  • Danilo Nascimento Em: 29 de dezembro de 2010 as 20:16

    Cara, valeu!

    Muito bom

  • fernando antonio Em: 4 de janeiro de 2011 as 14:52

    Gostei muito da video aula mas estava precisando de fazer uma galeria shadowbox dinamica com banco de dados tem jeito?E dentro de uma div.O site só troca a parte do meio

  • Cari Em: 10 de janeiro de 2011 as 15:10

    Boa tarde! Comigo não funcionou no IE… no Firefox e Chrome sim… o que posso fazer? Obrigada!

  • Jorge Em: 26 de janeiro de 2011 as 1:14

    cara, valeu mesmo!!!
    vc salvou meu site……rs
    muito obrigado

  • Danielle Em: 31 de janeiro de 2011 as 23:50

    Cara, adorei o tutorial! Valeuzão!

  • Rodrigo Em: 1 de fevereiro de 2011 as 22:22

    Cara mato a pau nessa video aula .. muito boa mesmo parabens ..
    Soh fikei com uma duvida .. pra usar a opção de arrastar a img “drag” como eu faço?
    grande abraço

  • Douglas Oliveira Em: 10 de fevereiro de 2011 as 16:54

    Obrigado Deus por ter feito o Robson ,cara muito massa essa aula ,vc tem um dom pra explicar vei muito boa a aula nota 100000000000000000000000000000000000.
    Abraço!

  • Victor Hugo Campos Em: 25 de fevereiro de 2011 as 16:29

    Cara, sem brincadeira, sou leigo em programação e segui seu passo a passo, FUNCINOU PERFEITAMENTE. Gostaria sinceramente de te parabenizar pelo ótimo conteúdo e pelo trabalho colaborativo que faz na rede. PARABÉNS E OBRIGADO MAIS UMA VEZ. Acabou de ganhar um fã.

  • Daniel Amorim Em: 15 de março de 2011 as 12:13

    Estou fazendo um site que o cliente msm quer fazer as atualizaçoes e ele só manja o HTML, to na luta de fazer td em HTML, só falta a galeria de fotos, fiz ela com jQuery e Shadowbox, conforme o tutorial dessa pagina, porem tenho que joga-la em iframe, mas ela só abre na area do iframe, gostaria que ela abri-se em toda pagina, alguem pode me ajudar por gentileza.
    OBS.: PARABÉNS PELO O TUTORIAL, FANTASTICO

  • Caty Em: 17 de março de 2011 as 13:18

    Legal…. Como faço para abrir vários videos. Ou seja que apareça vários videos e o usuário escolher um e ver.

  • JR2000 Em: 19 de março de 2011 as 20:00

    Show de bola esse video aula, eu preciso criar algo parecido com a tua video aula so que gostaria de saber se ao inves de vc clicar nos links teria como abrir de forma automatica o efeito sem precisar clicar nos links. Obrigado

  • Daniel Landucci Em: 20 de março de 2011 as 21:08

    Olá… segui os passos desse tutorial e consegui fazê-lo funcionar! Porém, algo que não entendi bem é que, determinados links não carregam as páginas HTML. Links como meu perfil do Facebook, You Tube, Picasa e Twitter não abrem. Ficam com uma tela escura e não sai disso. Outros links como LinkedIn e Blogger está carregando normalmente.

    Como corrigir o problema?

  • Róger Em: 22 de março de 2011 as 11:57

    Buenas, Robson!
    Primeiramente parabéns pela Vídeo Aula!

    Olha só, estou desenvolvendo um site e possuo nele alguns includes e iframes.
    A função da da shadow estta ok(realiza o efeito), só que por algum motivo esta fazendo o efeito somente no topo do site, exatamente onde tenho um include.

    Pergunto, há uma solução para isso?
    Link do projeto: http://www.aguiaazul.net.br/galeria.php?id=14

    Atenciosamente,

    Róger

  • Robson V. Leite Em: 23 de março de 2011 as 19:21

    @Róger: Pra min funfo normal oO

  • Bruno Em: 27 de março de 2011 as 0:57

    Caraca muito bom o tuto,
    estou num projeto e a 2 dias testando algumas galerias para exibir videos
    e nao obtia sucesso e agora em menos de 10 minutos ja esta no ar.
    só que estou utilizando varios videos puxados do banco de dados
    e a maioria funcionava somente no 1º link

  • william Em: 30 de março de 2011 as 17:28

    ola amigo, como tirar o fundo preto e colocar branco?

    mt obg

  • Guto Sanches Em: 30 de março de 2011 as 19:53

    fala Robson!!
    venho acompanhando várias video aulas suas, e sempre funfo certinho em meu site,
    só q dessa vez, coloquei em meu site mas num da certo!
    quando clico no link, ao inves de abrir com o efeito lightbox, abre os videos e em tela cheia.
    já hospedei os arquivos em .css e em .js na internet para dar td certinho, pq direto do meu browser num funciona, só q mesmo assim num dá em nd, só acontece oq citei acima.
    está tudo neste link q é uma página de testes>>
    http://www.worldofskate.com.br/logo/

    vc pode me dar uma força por favor?
    obrigadão mesmo ai.

  • Guto Sanches Em: 30 de março de 2011 as 19:56

    ah! e outra coisa.

    só está funfando no Firefox 4.
    No IE9 e no Google Chrome não

  • Robson V. Leite Em: 31 de março de 2011 as 9:32

    @Guto Sanches: na inicialização do plugin no seu head, veja se o último comando esta com “;” se sim remova e teste.

  • Daniel Amorim Em: 31 de março de 2011 as 11:30

    como fazer a galeria abrir por cima da pagina, sendo que a galeria esta no iframe

  • Valdir Marques Em: 31 de março de 2011 as 16:20

    Robson, boa tarde mestre!

    Seguinte: Parabéns pela video aula. Show de Bola.

    Porém não to conseguindo fazer a integração desse efeito com a galeria swf do meu site.
    Pois na video-aula, vc utilizou um index.html
    E no meu site, em php, eu utilizo os meus swfs em uma listagem desordenada, ul – li.

    Pode me ajudar a fazer essa integração.

    PS: graças a sua grande ajuda é que meu site está no ar hoje.

    Obrigado

  • Rogério leal lima Em: 13 de abril de 2011 as 0:14

    Pessoal estou usando o shadowbox para abrir uma página de pesquisa, o funcionamento é o seguinte, tenho um página com dois campos e um link ao clicar no link abro a página de pesquisa com shadow, nessa página é feitra a escolha de um nome após clicar nele gostaria de atualizar a caixa de texto da página que chamou o shadow, alguem sabe como devo fazer?

  • Guto Sanches Em: 15 de abril de 2011 as 1:16

    Robson, desculpe-me por estar te enchendo, mas eu fiz oq vc falo acima, e num deu em nd, continua sem funfar, quer dizer, soh funciona msm no Firefox 4, no Google Chrome e no IE9 não.
    se puder me dar mais uma ajudinha ai amigo, te agradeço mto msm.
    Se vc tiver alguma idéia do q seja, por favor me diga, preciso mto desse efeito.

  • Robson V. Leite Em: 15 de abril de 2011 as 19:34

    @Guto Sanches: tenta inicializa o shadowbox assim:

    </script>
    
    <script type="text/javascript">
    Shadowbox.init({
        language: 'pt',
        players:  ['img', 'html', 'iframe', 'qt', 'wmp', 'swf', 'flv'],
    });
    </script>

    Veja se não existe outro aplicativo java incluso em seu projeto. Usar 2 frames pode ocasionar em conflito e o jQuery para de funcionar!

  • Caty Em: 4 de maio de 2011 as 14:07

    Robson a minha janela não fecha no icon X. O que será? Também queria saber se é possivel que essa janela tenha o tamaho de acordo com o conteudo.

  • Cassio Em: 14 de maio de 2011 as 21:07

    Adorei sua video aula muito boa vc esta de parabens, gostaria de saber se vc sabe fazer o efeito page flip com o jquery e como se faz? tem como fazer isso?

  • CIDICLEY CINTRA Em: 31 de maio de 2011 as 15:20

    boa tarde gostei muito deste plugin do jQuery vou acrescentar em alguns dos meus trabalhos, pois gosto muito de usar o jQuery, parabens pela video aula.

    aproveito para perguntar o seguinte: vc tem alguma video aula publicada que mostra como fazer upload multipos e resize de imagem com php, consigo fazer eles separados, mas nao os dois ao mesmo tempo

  • Daniel Landucci Em: 15 de junho de 2011 as 11:24

    Olá, publiquei um problema que ocorre em determinado carregamento de websites dentro do shadowbox. Ainda não consegui resolver esse problema (se é que tem como). Gostaria de saber se alguém teve esse problema e se conseguiu resolver?

    Grato quem puder me ajudar!

  • Luciano Júnior Em: 16 de junho de 2011 as 19:19

    @Daniel: adicione o seguinte codigo:

    <script type="text/javascript">
    Shadowbox.init({
        language: 'pt',
        players:  ['img', 'wmp', 'swf', 'flv'],
    });
    </script>
    
  • Janio Em: 23 de junho de 2011 as 21:45

    Olá amigo eu vi uma video aula sua sobre shadowbox e fiz para meu site, oque ocorreu foi o seguinte do lado esquerdo das imagens que estão pegando o efeito shadowbox a uma div
    com videos com efeito cycle, com o navegadoe firefox 3.5 abre perfeitamente a imagens sobre todas as divs, ja com crome e explorer, não abre por sobre a div que esta o video entende a imangem entra dentro da div e fica metade escondida atraz do video oque fazer para resolver isso
    amigo?

  • Christian monteiro Em: 27 de junho de 2011 as 1:42

    Olá Robson gostei muito desse plugin eu usava o Lightbox e agora mudei para o shadowbox e gostei muito, porem eu tenho uma duvida quando clico na imagem o fundo escurece para dar destaque na imagem que vai aparecer tem como diminuir a claridade do fundo pra poder ficar com mais destaque a imagem que vai aparecer valewwww….

  • Josimar Em: 29 de junho de 2011 as 0:19

    Olá Robson, gostei muito deste topico, e fiz uma página de comentários onde o form é aberto dentro do shadowbox, e quando o usuário clica em enviar vai para a pagina de de envio do form. O que gostaria de fazer é apos a confirmação do envio fechar o shadowbox e atualizar a página atual. Tem como fazer isso

  • Michel Lima Em: 30 de junho de 2011 as 12:26

    Parabéns cara!! Mto bom.. Sempre acompanho a UpInside e está cada dia melhor!!
    Abraço!

  • Nicolas Em: 15 de julho de 2011 as 11:01

    Opa! Muito obrigado pela video aula..só não sei uma coisa, e precisava aprender.
    Queria que ao abrir o site, automaticamente abrisse uma shadowbox com uma imagem..um anuncio, no caso.
    Poderia me explicar como fazer?
    Brigadão!

  • Luciano Júnior Em: 16 de julho de 2011 as 9:36

    Simples assim, ele clica no link:

    window.onload = function(){
            document.getElementById("ID do link").click();
    } 
  • Igor Barra Em: 19 de julho de 2011 as 14:46

    Parabens pela video-aula!mt boa, Mas tenho uma duvida, no site que estou criando, uso o shadowbox numa pagina de agenda de eventos, onde tem varios elementos (miniaturas) que quando se clica, abrem com mais informaçoes pelo shadowbox. Quero adicionar o link “curtir” do facebook dentro do conteudo, aberto no shadowbox.. Ate ai td bem, só que seria interessante que quando uma outra pessoa, clicar no link divulgado dentro do facebook, quero que ela caia na página agenda, com o shadowbox aberto, referente ao link dela (e não a pagina do evento em si avulsa). Espero ter sido claro na minha duvida. Obrigado e parabens ai

  • Fabio Rodrigo Em: 3 de agosto de 2011 as 21:45

    Oi Robson…

  • Fabio Rodrigo Em: 3 de agosto de 2011 as 21:48

    Blz Robson, show de aula.

    Cara como eu faço para colocar aquelas “setas” abaixo da shadow para mostrar outras imagens?
    Eu vi no site do shadowbox, eu li no site, mas não consegui.

    Valeu mano!!! Fique com Deus.

  • Fabio Rodrigo Em: 3 de agosto de 2011 as 21:48

    Blz Robson, show de aula.

    Cara como eu faço para colocar aquelas “setas” abaixo da shadow para mostrar outras imagens?
    Eu vi no site do shadowbox, eu li no site, mas não consegui.

    Valeu mano!!! Fique com Deus.

  • Robson V. Leite Em: 9 de agosto de 2011 as 18:35

    @Fabio Rodrigo: Você tem que determinar o grupo de imagens para que ele reconheça como galeria, rell=”shadowbox[galeria]“. galeria seria o identificador do grupo, todas as imagens com esse identificador serão paginadas em uma shadowbox!

  • Wagner Navac Em: 9 de setembro de 2011 as 12:47

    Bom dia, eu configurei o shadowbox, deu tudo certo, porem eu gostaria de o video já sair rodando, percebi que dentro do shadowbox.js ele ja estah setado como autoplayMovies:true, há alguma outra coisa que posso fazer para ele iniciar assim que clicado no link? Desde já agradeço.

  • Eduardo Em: 9 de setembro de 2011 as 21:58

    Tenho uma duvida, se eu quiser abrir o shadowbox dentro de uma div ela abriria só na div ou na tela toda?

  • Ilson Marques Em: 19 de outubro de 2011 as 15:04

    Olá Robson, meu querido.

    Fiz um outro site acompanhando as video-aulas do curso em DVD e está funcionando uma maravilha com o painel de gerenciamento e tudo mais no Firefox e Crome, exceto no famigerado Internet Explore, vrsões 8 e 9. Neste está ocorrendo erro na galeria de imagens usando o plugin jquery fancybox (a imagem aparece crua, sem o efeito) e naquele, o menu dropdown não aparece. Se você puder acessá-lo pra constatar os erros e posteriormente me dar uma mãozinho, agradeço! Este novo site está hospedado no subdomínio do meu site: http://www.vhouse.com.br/renerfranco

  • Filipe Barros Em: 22 de novembro de 2011 as 2:54

    Querido, meu site carrega o conteúdo em uma determinada div, ou seja, a imagem que quero abrir em lightbox está em um arquivo próprio que não é o index e será carregado em uma div do index, nesse caso o shadowbox não funcionou, você poderia me dizer se tem como fazer?

  • Bibiana Em: 8 de dezembro de 2011 as 12:12

    Muito bom! Aprendi muito, valeu!

  • Tom Em: 9 de dezembro de 2011 as 3:55

    Como faço para que abra automaticamente a shadowbox quando abrir o site. Tipo, quero que quando a pessoa entre no meu site abra a shadowbox automaticamente para que ela veja um vídeo sem a necessidade de clicar no link que é gerado. Também gostaria de saber como fazer para o vídeo rodar automaticamente sem a necessidade de apertar o play. Grato, ótima vídeo aula!

  • Josemar Em: 14 de dezembro de 2011 as 17:22

    Parabéns Robson, muito bom.

    Funcionou beleza. Tenho uma pergunta e vou fazer pq tentei de tudo e não consegui. Como tirar a barra de rolagem da página html que abre dentro do shadowbox?

    Grande abraço

  • Rafael Marchesin Em: 7 de janeiro de 2012 as 23:05

    Está aí, a quantidade de comentários nesta página mostra a qualidade desta aula. É a melhor que eu encontrei sobre lightbox. Só tenho a agradecer.

  • Fabio Oliveira Em: 9 de janeiro de 2012 as 21:31

    Oi Robson,

    Cara não sei se você vai saber, mas como eu faria para quando fechar a Shadowbox atualizar a página anterior? Pois quando eu abro a shadowbox e cadastro tenho que atualizar na mão para ver o resultado.

    Valeu…

  • Felipe Lacerda Em: 19 de janeiro de 2012 as 15:01

    Estou usando o Shadowbox juntamente com a jCarouselLite, o problema é que no jCarouselLite tem apenas 2 imagens, quando clico em uma habilitando o Shadow na janela supensa duplica a quantidade de imagens e aparece: 1 de 4 ao invés de 1 de 2.

    O que poderia ser?

  • Pedro Em: 22 de janeiro de 2012 as 22:59

    Robson,
    Não estou conseguindo fazer o download do Shadowbox. Tem como você me enviar por e-mail?

    Grato

  • Luciano Santos Em: 30 de janeiro de 2012 as 19:04

    Kara gostei da aula, porém gostaria de saber se tem como retirar esse fundo escuro… tipo deixar so a imagem abrindo sem o fundo escuro… um abraço

  • Robson V. Leite Em: 31 de janeiro de 2012 as 10:58

    OLá Luciano, o Shadowbox vem com um arquivo CSS. nele você pode alterar ester parametros!

  • Ronaldo Neves Em: 10 de fevereiro de 2012 as 14:48

    Boa aula Robson! Só estou com uma dúvida e problema, quando o título que coloco no link é maior que a imagem ele não aparece todo, como posso resolver esse problema?

  • Jairo Brasil Em: 7 de março de 2012 as 13:08

    Ei, alguem sabe como faço para o vídeo que inicializa dentro do shadowbox, ficar sem a necessidade de apertr o play?

  • jenner Em: 18 de março de 2012 as 10:15

    nao consegui ainda colocar um box do lado direito do lightbox para que possa colocar uma ficha tecnica da foto ou video.

  • André Luiz Em: 1 de abril de 2012 as 13:37

    Abrir PDF no shadowbox.

    O shadowbox não da suporte para abrir PDF, segundo informações no site da shadowbox.

    Com este script http://shadowbox.1309102.n2.nabble.com/file/n3700612/shadowbox-gdoc.js

    e incluindo ‘GDOC’ no Shadowbox.init é possível abrir arquivos em pdf

    abraços

  • jenner Em: 5 de abril de 2012 as 18:14

    Robson,

    Preciso abrir fotos e videos com o shadowbox, mas com uma ficha tecnica do lado esquerdo desses elementos. uma ficha diferente para cada galeria.

  • jenner Em: 5 de abril de 2012 as 18:16

    Jairo Brasil,

    antes de fazer o download voce pode configurar o que vai baixar la na pagina do shadowbox.

  • jenner Em: 5 de abril de 2012 as 18:20

    william,

    no css do shadowbox voce pode mudar a cor do fundo e até deixa-lo transparente.

  • André Luiz Em: 6 de abril de 2012 as 10:18

    Funcionou em todos os navegadores, exceto no IE como sempre, então depois de pesquisar um pouco encontrei a solução:

    No shadowbox.js localizar esta parte do código e remover

    ‘style=”visibility:hidden” onload=”this.style.visibility=\’visible\’”‘+

    Depois encontre esta parte do código

    win.location.href = this.obj.content;

    e substitua por:

    win.location = this.obj.content;

    Com isso o IE abrirá o PDF dentro da shadowbox.

    Mantenha a chamada dos dois arquivos, shadowbox.js (alterado para IE) e o shadowbox-gfoc.js (para os demais navegadores), que funcionará perfeitamente nos seguintes navegadores (pelo menos nos que eu testei): IE, Firefox, Opera, Chrome e Safari.

    Fonte de pesquisa para alteração do arquivo: http://www.shadowbox-js.com/forum.html

  • Robson V. Leite Em: 9 de abril de 2012 as 16:58

    Ao lado da imagem junto com a modal? cria um HTML com o modelo pronto e chama o HTML pela Shadow! :P

  • Eduardo Souza Em: 10 de abril de 2012 as 5:54

    Olá, parabéns pelo tutorial!

    Uma pergunta amigo.

    Como eu faço para usar uma imagem de fundo no lugar do overlay com opacidade?

    Abraço

  • Paulo Silva Em: 17 de abril de 2012 as 22:25

    Olá amigo, sua aula é muito boa como todos já falaram, agora uma coisa que estou quebrando a cabeça é: Como deixar os vídeos em miniatura, como esse seu, não consigo fazer isso, você poderia mim da alguma explicação, eu agradeceria muito..

  • Igor Augusto Em: 22 de abril de 2012 as 3:10

    Robson, eu estou utilizando o shadowbox para criar uma “galeria” de fotos, buscando as mesmas de um banco de dados mysql, onde se encontra os nomes das imagens. Porem ao buscar todas, ao invés de abrir a primeira, ele abre a última, sendo assim, tendo que ficar voltado, ao invés de avançar ! Gostaria de saber se teria como arrumar isto !

  • Augusto Matos Em: 23 de abril de 2012 as 19:56

    Excelente video aula, ta de Parabéns!

  • Nelson F Frugeri Júnior Em: 4 de maio de 2012 as 17:20

    Olá, Robson, tdo bem cara? Meu suas aulas são muito boas, estou aprendendo muito contigo cara, estou construindo meu site com as suas aulas.

    Mas estou com um pequeno problema na shadowbox. Ela está funcionando, mas ao abrir a imagem na shadowbox, abre somente metade da imagem, o que pode ser, aguardo sua resposta meu querido Robson.

    Fico muito Grato!

    Obrigado.

  • Nelson Ferreira Frugeri Júnior Em: 6 de maio de 2012 as 15:50

    Fala Robson blz cara? Muito bom suas aulas, mas estou com um pequeno problema em minha shadowbox.

    Ela está abrindo normal, mas ao abrir aparece na tela apenas metade da imagem.

    O que pode ser?!

    Desde já agradeço. Até!

  • Sandro Em: 7 de maio de 2012 as 20:40

    Muito bom o tutorial.
    É possível abrir uma foto usando esse efeito a partir de um arquivo SWF? Como ficaria a Action do botão?
    Obrigado!

  • Edison Em: 17 de maio de 2012 as 15:24

    Show de BOLAAAAAAAAAAAAAAAAAAAAAA
    Simplesmente…

  • Luiz Filipe Em: 19 de maio de 2012 as 18:01

    Muito bom parabéns valeu….

  • Gisélia Em: 21 de maio de 2012 as 18:54

    Olá Robson, Parabéns.
    Obrigada por compartilhar seus conhecimentos conosco.
    Funcionou direitinho.
    Só não estou gostando do IE como sempre não funciona conforme o esperado. Valeu mesmooo

  • Vítor Em: 11 de julho de 2012 as 16:40

    Eu só consegui fazer o shadowbox funcionar para todas e para abrir o conteúdo só as fotos deram certo. De qualquer maneira, meus parabéns, tenho certeza que o meu caso deve ser alguma coisa boba.

  • Eliseu Lucena Pires Em: 28 de julho de 2012 as 22:18

    Muito boa essa vídeo aula. Maravilha! Será que é possível indicar algum tutorial em português de como usar mais o Shadowbox? Tipo ser um usuário avançado desse plugin do JQuery?

  • wallace Em: 23 de agosto de 2012 as 19:19

    Bom dia amigo.

    O trem funcionou legal, o único problema é que eu uma página muito “alta” e o link para o vìdeo estando muito em baixo, ele gera o efeito no início da página. Vc sabe como resolver isso?

    Se mais alguém souber eu agradeço.

    At.,

  • Abrindo imagens, páginas e vídeos com jQuery e Shadowbox! | Blog de Tecnologia Em: 7 de novembro de 2012 as 23:09

    [...] Vídeo Aula de Referencia: Abrindo imagens, páginas e vídeos com jQuery e Shadowbox! [...]

  • Alexandre Em: 12 de dezembro de 2012 as 12:55

    Olá Ronson!!! Parabéns pela vídeo aula!!! Estava instalando o plugin em um site de testes e estava meio complicado, após assistir sua V.A. ai descomplicou…
    No Chrome e no FireFox funcionou corretamente… mas no IE9 trava… ele cria uma borda azul envolta das imagens e quando clicka na mesma, o site trava, o cursor perde a funcionalidade de acessar qualquer coisa na página, e só resolve se atualizar o navegador, mas ai nem pensar em clickar novamente nas imagens…rsrsrsrs
    Já verifiquei os códigos, scripts do site, e controles activex do ie, java etc…
    Não sei o que pode estar acontecendo, vc pode dar alguma dica?

    Deixei o mesmo pedido de ajuda no:

    http://www.upinside.com.br/codigo-pronto/abra-imagens-galerias-videos-e-paginas-em-efeito-lightbox

    Grato pela atenção!

  • Robson V. Leite Em: 25 de dezembro de 2012 as 11:23

    Olá Alexandre. tenho sim. Clique aqui!

  • fabio oliveira Em: 27 de dezembro de 2012 as 17:47

    Oi Robson, não sei se você sabe. Tem como tirar a barra lateral?
    Obrigado

Deixe seu comentário!