Tutorial Shadowbox Parte III
Hoje vou explicar como usa-lo sem ser com um simples vídeo do Youtube.
Como já foi referido o Shadowbox tem potencialidades para funcionar com imagens, videos de varios formatos, ficheiros em flash e até com paginas.
Usando ficheiros no formato FLV, MOV e WMV:
Para usar o Shadowbox em videos destes tipos temos que copiar o código do vídeo a usar no site onde está alojado (Embed):<object width="540" height="450"><param name="movie" value="http://sic.aeiou.pt/online/flash/consola_video_sap.swf?urlvideo=http://videos.sic.pt/CONTEUDOS/sicweb/20090306_mario_lino_63200917488_web.flv"></param><param name="allowFullScreen" value="true"></param><embed src="http://sic.aeiou.pt/online/flash/consola_video_sap.swf?urlvideo=http://videos.sic.pt/CONTEUDOS/sicweb/20090306_mario_lino_63200917488_web.flv" type="application/x-shockwave-flash" allowfullscreen="true" width="540" height="450"></embed></object>
(exemplo Vídeo da Sic)
Neste código vamos apenas usar o endereço do vídeo (a vermelho):http://videos.sic.pt/CONTEUDOS/sicweb/20090306_mario_lino_63200917488_web.flv
e substituir ENDEREÇO DO FICHEIRO (no código do shadowbox por este endereço e a parte O QUE VAI APARECER NO BLOG por Clicar para ver vídeo.
Ficando assim:<a href="http://videos.sic.pt/CONTEUDOS/sicweb/20090306_mario_lino_63200917488_web.flv" title="TÍTULO DO VÍDEO" rel="shadowbox" >Clicar para ver video</a>
Para terminar é necessário definir as medidas dos vídeo. Essas medidas vão ser inseridas logo após a palavra shadowbox, separadas por ponto e virgula. Ficando assim para as medidas 600 pixels de largura (width)e 485 pixels de altura (height) que são medidas que normalmente uso:<a href="http://videos.sic.pt/CONTEUDOS/sicweb/20090306_mario_lino_63200917488_web.flv" title="TÍTULO DO VÍDEO" rel="shadowbox; width=600; height=485" >Clicar para ver video</a>
O resultado é este:
Clicar para ver video
Se pretender usar uma imagem:
<a href="http://videos.sic.pt/CONTEUDOS/sicweb/20090306_mario_lino_63200917488_web.flv" title="TÍTULO DO VÍDEO" rel="shadowbox; width=600; height=485" ><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 127px; height: 71px;" src="http://sic.aeiou.pt/SICProgramas/Images/logo_sic.png" alt="" border="0" /></a>
O resultado é este:
NOTA: Pode utilizar os formatos mov e wmv basta somente colocar o link directo de acesso ao vídeo.
Category: Blogger
Muito legal este Post, tem com postar uma forma de tirar o estilo do video e aplicar o nosso, e pricipalmente de fzer abrir automatico sem perguntar se quer abrir ou salvar?
Oi tem como colocar fotos de um album, onde aparece a setinha de proximo. Não apenas uma mas um numero de fotos de um album ok