Pedido HighSlide JS

[Krunsher]

Qual a URL do seu fórum: http://www.digitalrip.com.br
Tipo de Hospedagem: Free
Qual a versão do phpBB: phpBB 3.0.10
É um novo ou uma conversão: Instalação Limpa
Usuário de teste: Usuário: teste Senha: 123456
Estilos instalados: eTech
Modificações instaladas:

Simple Hide BBcode MOD
Thanks Post Mode (Hide Mod Compatible)
Code Gerator

Qual seu nivel de experiência:: Iniciante
Pedido::
Opa galera! Eu não tenho certeza se esse é o nome do BBCode, mas coloquei no titulo, mas tenho quase certeza. rs..
O BBCode que eu queria funiona assim, ele diminui uma imagem e deixa ela de um determinado tamanho, e quando o mouse passa sobre ela, fica com uma lupa, e ao clicar, a imagem fika em seu tamanho original na propria página:

Um exemplo:





Taah.. Eu vi isso no ripando.com.br .... :lol: :lol: :lol:

E vocês podem ver os tópicos lá para terem uma ideia melhor(testuset, 123456)

O BBCode dessas screens é [ss]o texto[/ss]

Thanks galera!

[robra]

[Krunsher]

Ops.. Não sabia que precisava na área de BBCodes tmb.. Foi mau, vou editar.. :)

[robra]

Após fazer uma busca no Google com o texto "bbcode HighSlide JS", vários resultados apareceram e dentre eles:
- [BBCode] QR code with Highslide zoom

Isso deve funcionar se você tiver o MOD Highslide Attachment ou ReIMG Imagem Resizer (de MODDB) instalado, caso contrário, você precisará baixar e copiar Highslide em algum diretório (por exemplo: /scripts) e carregar o script abaixo no overall_header.html, antes da tag </head>:

Código: Selecionar todos

<!-- IF S_VIEWTOPIC -->
<script type="text/javascript" src="{ROOT_PATH}scripts/highslide/highslide-full.packed.js"></script>
<link rel="stylesheet" type="text/css" href="{ROOT_PATH}scripts/highslide/highslide.css" />
<!-- ENDIF -->

De qualquer forma, segue o BBcode:

BBcode:

Código: Selecionar todos

[qrcode]{URL}[/qrcode]

Html:

Código: Selecionar todos

<div class="highslide">
<a href="http://chart.apis.google.com/chart?chs=250x250&cht=qr&chl={URL}" class="highslide" title="Click to Enlarge QR Code" onclick="return hs.expand(this, { wrapperClassName: 'dark', slideshowGroup: 'highslide' })"><img src="http://chart.apis.google.com/chart?chs=250x250&cht=qr&chl={URL}" alt="QRCodeThumbnail" title="" style="max-width:30px; max-height:30px;" /></a></div>

Linha de ajuda:

Código: Selecionar todos

[qrcode]Link da imagem[/qrcode]

Demonstração: LINK

Fonte: phpbb3bbcodes

Abraço.

[Krunsher]

Esse ficou um pouquinho diferente do outro, mas ele tambem é muito bom, gostei muito. Thanks.. ;)

[robra]

Ele está colocando as imagens uma embaixo da outra porque você colocou <div class="highslide"> no código.
Repare que no código que lhe passei no Tópico Instalação do Highslide Attachment no subsilver2 não tem <div class="highslide">.

A propósito, como está o tópico Instalação do Highslide Attachment no subsilver2 ?

Abraço.

[Krunsher]

Robra, eu juro que eu ri aqui cara, kkkkkkk.. tu eh adivinho? kkkkkk.. se eu tivesse aqui eu iria mandar aquele emoticon da bola de cristal que você tem.. kkkk.. Cara, eu ia criar um tópico pra resolver esse problema das imagens abaixo uma da outra.. rs..
-
Consegui resolver devido sua dica do div, que antes eu não sabia pra quer servia. O código que você me passou eu coloquei corretamente, igual ao seu, e continuou, ai eu pensei onde poderia ser o erro, ai eu lembrei do HTML do BBCode e editei ele, e tinha o <div class="highslide">.. rs..

Esse ficou um pouquinho diferente do outro, mas ele tambem é muito bom, gostei muito. Thanks.. ;)

Descobri que não é diferente, e sim ele foi customizado. Nesse momento eu estou customizando o highslide-full.js ele para ficar como nas imagens que eu postei no começo. Já tirei os créditos, e tifei o efeito de fade ao expandir a imagem, só não estou conseguindo diminuir aquela borda e deixar ela quadrada, e não arredondada como ela está.

[robra]

No HTML do BBcode, tente alterando para:

Código: Selecionar todos

<a href="{URL}" class="highslide" onclick="return hs.expand(this)"><img src="{URL}" alt="Highslide JS" title="Expandir" width="320"></a>

Vamos ver no que dá.

Abraço.

[robra]

O problema é que você está utilizando o HighSlide Gallery, sendo que o "ripando" usa o HighSlide JS core.
Veja a diferença na página http://highslide.com/, clicando nas imagem na seção HighSlide JS core e na seção With Gallery.

Abraço.

[Krunsher]

Ata, entendi porque a diferença robra... :)
De todo geito, gostei do estilo que está lá agora. Acho que vou mante-lo..
Obrigado pela ajuda cara!