Lightbox da Galeria Adaptativa. Os melhores plugins de lightbox para wordpress

A biblioteca mais popular é o Lightbox Javascript, que usamos por muitos anos em desktops, mas não em plataformas móveis.

Eu dou o seu plugins de lightbox Ganhe 14 com suporte para plataformas móveis.

Photoswipe.

Photoswipe - Fácil, com suporte ao toque e o plugin modular mais importante, que permite remover as peças desnecessárias que não são necessárias. Funciona bem em navegadores móveis. Você pode alterar as imagens movendo o dedo, como se fosse um aplicativo padrão, com transições suaves.

  • Bibliotecas necessárias: não.
  • Suporte ao navegador: IE8 +, Chrome, Firefox, Safari, Opera e outros navegadores móveis.
  • Licença: Licença do MIT.

Pop-up magnífico.

Magnific PopUp - é outro plugin da Likebox, projetado pelo mesmo autor como Photoswipe, Dmitry Semenovyv. O plugin vem no plugin jquery / zepto e também inclui suporte que está faltando no photoswipe, como: suporte de vídeo, cartões e Ajax. Esta é uma excelente alternativa para aqueles que preferem ter mais oportunidades em mãos.

  • Bibliotecas necessárias: Jquery 1.9.1+ ou zepto.js
  • Suporte ao navegador: IE7 (parcialmente) ,.
  • Licença: Licença do MIT.

Swipipebox.

Plugin do JQuery do Swipebox com suporte para gestos sensoriais para plataformas móveis. Ele também suporta vídeo do YouTube e Vimeo, além de imagens. O SwipeBox é fácil de instalar e possui várias opções para configurar sua configuração. Eu acho que a Swipbox é plugin demasiado picada para aqueles que não têm javascript.

Caixa de luz para bootstrap

Inicialmente, o plug-in da Likebox está ausente no bootstrap. Caixa de luz para bootstrap corrige isso. Se você estiver usando Bootstrap, é altamente recomendável usar esta biblioteca. O plugin está bem integrado com bootstrap.

  • Bibliotecas necessárias: Módulo jquery e bootstrap
  • Suporte ao navegador: IE8 +, Chrome, Firefox, Safari e Opera
  • Licença: Licença GNU.

Lightbox do Nivo.

O Nivo Lightbox é um plugin flexível de gozo personalizado. Uma variedade de opções permitem que você mude aparência. Por exemplo: tópico, animação de aparência e tipo de navegação.

  • Bibliotecas necessárias: Jquery.
  • Suporte ao navegador:
  • Licença: Licença do MIT.

ImagelightBox.

ImagelightBox Simple Lightbox Plugin sem frescuras. É usado apenas para a imagem, daí o nome. Nem vídeo nem outros tipos são suportados. Também não requer marcação de HTML adicional; Marcação É suficiente. Este plugin é fácil de trabalhar.

  • Bibliotecas necessárias: Jquery.
  • Suporte ao navegador: IE9 +, Chrome, Firefox, Safari e Opera
  • Licença: Não especificado

Mini Lightbox.

Outro plugin da Likebox sem adições. A biblioteca pesa apenas 2 kilobytes e só funciona com imagens. Este é o plugin perfeito se você estiver se desenvolvendo apenas para Última versão Navegador e não há necessidade de suportar vídeo ou outros formatos.

  • Bibliotecas necessárias: não
  • Suporte ao navegador: Internet Explorer. 10 +, cromo, firefox, safári e ópera
  • Licença: Licença do MIT.

Lightcase.

Lightcase belo plugin likebox. Suporta várias espécies de animação, como: fade, elástico, zoom e rolagem. Além disso, também suporta vários tipos de mídia, incluindo o YouTube incorporado, vídeo HTML, SWF e formulários de entrada.

  • Bibliotecas necessárias: Jquery.
  • Suporte ao navegador: IE9 +, Chrome, Firefox, Safari e Opera
  • Licença: Licença GPL.

Luz de penas.

Plugin básico de penas, 6 kilobyte pesando para desenvolvedores sem problemas e inclui apenas o mais necessário. Se você precisar de um efeito de caixa, por exemplo, para um grupo de imagens na galeria, você poderá ativar a expansão da galeria. Você também pode desenvolver sua própria expansão para o plug-in para usar em seus projetos.

  • Bibliotecas necessárias: Jquery.
  • Suporte ao navegador: IE8 +, Chrome, Firefox, Safari e Opera
  • Licença: Licença do MIT.

Lightlayer.

LightLayer Fácil de usar o plugin da Likebox. O plugin suporta muitas opções, métodos de JavaScript personalizados e eventos de usuário. O plugin funciona com imagens, vídeos, cartões.

  • Bibliotecas necessárias: Jquery.
  • Suporte ao navegador: IE9 +, Chrome, Firefox, Safari e Opera
  • Licença: Licença do MIT.

LightGallery.

LightGallery, outro plugin da Likebox com grande quantidade funções. Inclui mais de 20 opções para configurar diferentes efeitos de caixa de luz.

  • Bibliotecas necessárias: Jquery.
  • Suporte ao navegador: IE7 +, Chrome, Firefox, Safari, Opera, Ios, Android e Windows Phone
  • Licença: Licença do MIT.

Fluidbox.

Fluidbox Likebox Plug-in funciona com imagens. Inclui suporte para várias exibições, incluindo uma imagem flutuante, uma imagem de uma posição absoluta, imagens com limites e depósitos e galerias. Há também um plugin do WordPress.

  • Bibliotecas necessárias: Jquery.
  • Suporte ao navegador: IE9 +, Chrome, Firefox, Safari, Opera
  • Licença: Licença do MIT.

Stripjs.

Plugin exclusivo da Caixa do stripjs. Em vez de impor uma imagem, o módulo da Likebox desliza junto com a imagem de um lado para o outro, para que a imagem não bloqueie todo o conteúdo. Stripjs suporta imagens e vídeo.

  • Bibliotecas necessárias: Jquery.
  • Suporte ao navegador: IE7 +, Chrome, Firefox, Safari, Opera, iOS 5+ e Android 3 +
  • Licença: Licença Creative Commons By-NC-ND 3.0

Muitas vezes os comentários de várias galerias de imagens, reuniram uma extensa coleção de apresentantes de slides e -plagins espetaculares. Há no banco piggy e da lighbox exclusivamente no CSS3, sem conectar bibliotecas adicionais de JS. Mas o tempo não se suporta, os usuários estão usando cada vez mais vários dispositivos móveis para o surf da Internet, o que significa a adaptabilidade dos elementos da web e, em particular, galerias de fotos com o efeito "" se torna uma das prioridades para as quais web designers e desenvolvedores devem prestar atenção .

Eu apresento outra seleção de 15 plug-ins adaptativos jquery, que são amigos, como com navegadores de desktop, e se encaixam perfeitamente nas telas de vários dispositivos móveis (laptops, smartphones, tablets, etc.).

Veja a demonstração em sites de desenvolvedores, baixe o plugin que deseja e crie, crie, crie ...

1. ilightbox.

ilighbox. - Este é um JQuery LightBox-Plugin com uma ampla gama de tipos diferentes de tipos de arquivos: Imagens, vídeo, Flash / SWF, conteúdo AJAX, quadros e cartões embutidos. Este plugin também adiciona os botões de redes sociais, o que permite aos usuários compartilhar conteúdo via Facebook, Twitter ou Reddit. Excelente característica da organização de slideshows espetaculares, galerias de imagem e videoclipes, com visualização nos modos usuais e de tela inteira.

ilighbox. funciona muito rapidamente e ao visualizar dispositivos móveisAlém disso, exibe corretamente o conteúdo processado. Entre outras coisas, usando este plugin, você pode facilmente implementar a saída de blocos de informações por tipo de janela modal.

  • Vício: jquery.
  • Navegadores de suporte: IE7 +, Chrome, Firefox, Safari e Opera
  • Licença: E o inferno sabe disso)))

2. Swipipebox.

Swipipebox. - Este é um plugin jquery com suporte para telas sensoriais da plataforma móvel. Além de imagens, o plugin suporta um vídeo incorporado do YouTube e do Vimeo. O SwipeBox é muito fácil de prender a qualquer projeto, o plugin tem várias opções intuitivas para configurar sua funcionalidade e comportamento. No site do desenvolvedor, uma documentação detalhada para conectar e usar o plugin, sem excesso de água, tudo é apenas no caso, por isso não é difícil descobrir onde, e por que, acho que não será difícil.

  • Vício: jquery.
  • Navegadores de suporte: IE9 +, Chrome, Safari, Firefox, Opera, Ios4 +, Android e Windows Phone
  • Licença: Eu não defini, talvez você tenha sorte)))

3. MagnificPopup.

Por muito tempo, bem conhecido e bem comprovado plug-in em jquery ou zepto.js. O autor do plugin - Dmitry Semenov, que é um desenvolvedor e plugin photoswipe, que dirá logo abaixo. Vem na forma de um plugin jquery / zepto, tem mais oportunidades ausentes no Photoswipe, como suporte de vídeo, mapeamento e conteúdo AJAX, implementação de janelas modais com formulários internos. Para todos os critérios, esta é outra ferramenta maravilhosa no desenvolvedor da Web. Separadamente, há um plugin para WordPress e a documentação detalhada para a configuração e uso. Alude apenas a falta de documentação em russo, a julgar pelo nome e sobrenome, o autor parece ser russo, nunca entendido por causa da perigo, ou por causa da consciência imaginária de seu sentimento, e Blah. Bem, ok, a quem precisa ser sacrificado, também não afundamos chá também))).

  • Vício: jQuery 1.9.1+ ou zepto.js
  • Navegadores de suporte: IE7 (parcialmente), IE8 +, Chrome, Firefox, Safari e Opera
  • Licença: Licença do MIT.

4. Photoswipe.

  • Vício: Javascript ou jquery
  • Navegadores de suporte
  • Licença: Licença do MIT.

11. Featherlight.

6 k.bit Lightbox-Plugin, para mais ou menos desenvolvedores experientes, é equipado com todos os recursos mais necessários. Além de suportar todos os tipos de conteúdo comuns (texto, imagens, iframe, AJAX), há uma conexão opcional opcional, assim como você pode desenvolver sua própria extensão para este plugin, que cumprirá plenamente suas necessidades ao criar um novo projeto . Como toda essa economia (desenvolvimento de expansão) funciona, não foi particularmente deliberada, mas aqueles que irão inserir este plugin, acho que vai entender))).

  • Vício: jquery.
  • Navegadores de suporte: IE8 +, Chrome, Firefox, Safari e Opera
  • Licença: Licença do MIT.

12. LightGallery.

LightGallery. - plugin multifuncional com múltiplos características adicionais. Vem com mais de 20 opções, para configurar os menores detalhes da caixa de luz. Há tudo, bem, ou quase tudo)). Uma galeria completa de imagens com miniaturas bem construídas, com elementos de navegação e uma rolagem em miniatura. Marcação HTML simples na forma de uma lista não ordenada

    Usando o atributo Data-SRC para fotos de tamanho completo. O mesmo com o vídeo do YouTube e Vimeo. Ele suporta intensamente todos os formatos de vídeo HTML5, MP4, Webm, OGG ... miniaturas animadas, layout adaptativo com suporte a dispositivos móveis, efeitos de slides e aparências suaves ao mudar de imagens e outros conteúdos. A aparência facilmente formada e configurada com usando CSS.. Pré-carga imagem e otimização de código. Navegando o teclado para desktops, bem como a capacidade de usar ícones adicionais de fonte. LightGallery. - É aqui que a verdadeira "combinação", a principal coisa não é se perder na abundância de configurações e as extensas possibilidades desse plugin.
    Aqueles que precisam de um controle deslizante decente, eu recomendo prestar atenção aos mesmos desenvolvedores.

    • Vício: jquery.
    • Navegadores de suporte: IE7 +, Chrome, Firefox, Safari, Opera, Ios, Android e Windows Phone
    • Licença: Licença do MIT.

    13. Stripjs.

    Incomum, eu diria: uma implementação incomum da Lightbox, mais precisamente, não é bastante a apresentação de conteúdo habitual, quando uma imagem ou vídeo, no design da Likebox, aparecer à direita, preenchendo não a tela inteira, mas apenas em o tamanho especificado de uma imagem ou vídeo de tamanho normal. Em telas grandes, essa abordagem é clara, a possibilidade de interação com a página permanece. Nas pequenas telas de dispositivos móveis, todo esse design inovador, suavemente entra em coluna clássica. A ideia é interessante, olhe para a demonstração, talvez alguém insira um criativo.

    • Vício: jquery.
    • Navegadores de suporte: IE7 +, Chrome, Firefox, Safari, Opera, Ios 5+ e Android 3+
    • Licença: Licença Creative Commons By-NC-ND 3.0

    14. Lightlayer.

    Um plugin de lightbox fácil de usar que é bem combinado com qualquer projeto e também fica bem em qualquer tela. O plug-in LightLayer apresenta o controle sobre o conjunto de configurações, como a mudança da cor do fundo e o grau de sua transparência, a posição da unidade base, a seleção de efeitos de transição ao abrir / fechar, funções que os usuários podem manipular de forma independente. O plugin funciona muito bem com o conteúdo de sites externos, players e cartões de vídeo embutidos.

    • Vício: jquery.
    • Navegadores de suporte: IE9 +, Chrome, Firefox, Safari e Opera
    • Licença: Licença do MIT.

    15. Fluidbox.

    Fluidbox - Likebox plugin exclusivamente para imagens. O número de todos os tipos de variações da representação da imagem é verdadeiramente impressionante. O plugin funciona muito bem com imagens em vários desenhos, incluindo imagens flutuantes, uma imagem com posicionamento absoluto, fotos e fotos emolduradas por quadro, e tendo recuos, com imagens únicas e combinadas na galeria. Em geral, em águas vãs para derramar, pintar todas as capacidades do plugin em uma curta vista não funcionará de qualquer maneira, então é melhor olhar para a demonstração, torcer, virar e pensar que esse plugin gostará de muitos.

    • Vício: jquery.
    • Navegadores de suporte: IE9 +, Chrome, Firefox, Safari, Opera
    • Licença: Licença do MIT.

    Isso é provavelmente tudo! Espero que esta pequena revisão ajude você a entender a pilha dos produtos propostos de desenvolvimento da Web. Eu quero notar que nem todos os plugins apresentados na seleção de plugins que usei em projetos de trabalho, a maioria delas provou em sites de teste ou em Lachak, por isso, se surgiram alguma dúvida, provavelmente os resolveremos juntos, e juntos, Como sempre tudo vai trabalhar conosco.

    Você está procurando por um modelo russified adequado para seus objetivos? Provavelmente, neste caso, você deve visitar os markeites de TemplateMonster. Para a simples razão que recentemente, uma nova seção de modelo apareceu no site. Agora, cada usuário pode se familiarizar com a coleção que atualizará e atualizará. Textos para modelos foram escritos manualmente. Mas esta não é a única vantagem dessas soluções prontas. Afinal, em seus pacotes, você pode encontrar tudo o que facilitará o trabalho no desenvolvimento do projeto on-line, incluindo o editor visual.

    Com todo o respeito, Andrew

    Duas imagens individuais

    Quatro conjunto de imagens.

    Começando.

      Baixe um zip do mais recente lançamento (ou qualquer outro anterior) da página de lançamentos do GitHub.

      Ou instalar usando o NPM:

      Npm install lightbox2 --save

      Abra o arquivo zip e pegue uma olhada nos Barebones, o exemplo de trabalho incluído na pasta / Exemplos.

    1. Pronto para definir a caixa de luz na sua página? Comece incluindo a luz CSS e o Javascript. Você pode pegar esses dois arquivos da pasta / dist.

      • Inclua o CSS no topo da sua página em seu Marcação:
      • Incluir o javascript na parte inferior da sua página antes do fechamento Marcação:
    2. Certifique-se de que o jQuery, que é necessário pela Lightbox, também é carregado.

      • Se você já usa jQuery no seu carregado antes do Lightbox.js. Jquery 1.7 ou maior é exigir.
      • Se você ainda não estiver usando o JQuery, eu criei um arquivo empacotado inclui a Lightbox e o JQuery. Incluir Dist / JS / Lightbox-Plus-JQuery.js em vez de Lightbox.js.
    3. Confirme se as quatro imagens carregadas pelo Lightbox.css estão no local correto. Você pode pegar as imagens da pasta / dist / images.

    Inicialize com HTML.

    • Imagens únicas. Adicione um atributo de LightBox de dados a qualquer link de imagem para ativar a Lightbox. Para o valor do atributo, use um nome exclusivo para cada imagem. Por exemplo: Opcional:
      • Adicione um atributo de título de dados se você quiser mostrar uma legenda.
      • Adicione um atributo Data-Alt se você quiser definir o atributo Alt da imagem vinculada.
    • Conjuntos de imagens. Se você tiver um grupo de imagens relacionadas que gostaria de combinar em um conjunto, use o mesmo valor de atributo de caixa de luz para todas as imagens. Por exemplo:

    Opções.

    Se você quiser alterar qualquer uma das opções padrão, ligue para o método de opção.

    Opção Padrão. Descrição.
    sempreshownavontouchdevices. falso Se true, as setas de navegação esquerda e direita que aparecem no mouse piso ao visualizar, os conjuntos de imagens sempre serão visíveis em dispositivos que suportam o toque.
    albumlabel. "Imagine% 1 de% 2" O texto exibido abaixo da legenda ao visualizar um conjunto de imagens. O texto padrão mostra o número da imagem atual e o número total de imagens no conjunto.
    desabilitar. falso Se for verdade, impedir que a página role enquanto a Lightbox estiver aberta. Isso funciona por configurações transbordamento escondido no corpo.
    fadeduração. 600 O tempo que leva para o recipiente de lightbox e sobreposição para desaparecer e sair, em milissegundos.
    fitimagesinviewport. verdadeiro. Se for verdade, redimensione as imagens que se estendiam fora da viewport, para que se encaixasse bem dentro dela. Isso salva o usuário de ter que rolar para ver a imagem inteira.
    imagineFadeedation. 600 O tempo que leva para a imagem desaparecer uma vez carregado, em milissegundos.
    largura máxima. Se definido, a largura da imagem será limitada a este número, em pixels. A proporção não será mantida.
    altura máxima Se definido, a altura da imagem será limitada a este número, em pixels. A proporção não será mantida.
    positionfromtop. 50 A distância do topo da viewport que o contêiner de lightbox aparecerá, em pixels.
    renização 700 O tempo que leva para o contêiner de lightbox para animar sua largura e altura quando a transição entre imagens diferentes, em milissegundos.
    showimagenumberlabel. verdadeiro. Se falso, o texto indicando o número da imagem atual e o número total de imagens no conjunto (ex. Image 2 de 4) será escondido.
    wraparled. falso Se true, quando um usuário atingir o último Iser aparecerá e a seta de navegação direita aparecerá e será para continuar avançando, o que os levará de volta para a primeira imagem no set.

    Suporte ao navegador

    O Lightbox2 foi testado com sucesso nos seguintes navegadores:

    • Internet Explorer.
      O arquivo Lightbox-Plus-JQuery.js inclui jQuery v2.x e suporta o IE 9+. Se você quiser suportar o IE 6, 7 e 8, use sua própria cópia do jQuery v1.x com o Lightbox.js.
    • Cromada.
    • Safári.
    • Raposa de fogo.
    • safari do iOS.
    • iOS Chrome.
    • Navegador android.
    • Chrome Android.

    Licença.

    • 100% grátis. A Lightbox é livre para usar em trabalho comercial e não comercial.
    • Atribuição é requird.Isso significa que você deve deixar meu nome, meu link da sua página inicial e a informação de licença intacta. Nenhum desses itens tem que ser voltado para o usuário e permanecer dentro do código.

    Ajuda.

    Tem alguma dúvida sobre como usar a Lightbox?

    Siga os passos abaixo para obter ajuda. Certifique-se de ter lido a documentação nesta página e olhando para o exemplo incluído primeiro.

    1. Pesquise o StackOverflow para ver se as pessoas da Oter são executadas para o mesmo problema que você está tendo.
    2. Se o seu problema é único, publique uma nova pergunta sobre o Stackoverflow. Use a tag Lightbox2.

    Não use problemas do GitHub para relatar solicitações de suporte pessoal.

    Encontrou um bug?

    Se você encontrar um bug, siga as instruções nas guildelines de contribuição para relatar o problema.

    O script organiza visualizar imagens em uma janela pop-up. A visualização pode ser organizada por uma imagem ou galeria, imagens Sraising na janela pop-up.
    O script mais fácil e rápido é instalado. Instalado e configurado literalmente em poucos minutos.

    Como instalar a Lightbox

    Baixe o arquivo, descompacte e baixe o servidor.
    Em seguida, incorpore o script ao seu site. DENTRO código HTML Páginas prescrever código




    E o último passo. Exibição de imagem.
    Saída de imagem fazê-lo


    Código de saída padrão para uma pequena imagem e links para uma imagem grande, apenas dois parâmetros são adicionados ao link.
    Aqui está um exemplo deste código - quando clicando na imagem aparece uma imagem grande.

    Para tal efeito corresponde ao parâmetro data-Lightbox \u003d "Imagem".
    Se você tiver muitas imagens na página, poderá abrir uma abertura de imagens sem percorrer a janela pop-up e poderá combinar imagens e irá percorrer a janela pop-up.
    Para combinar imagens, você precisa usar um nome para cada grupo de fotos.




    Como você pode ver, todas as imagens podem ser rolando em uma janela pop-up, já data-Lightbox. Todo mundo tem o mesmo.
    Se você quiser dividir as fotos para que não sejam espalhadas, use este código.



    Agora cada imagem abre separadamente, isto é, não há possibilidade de mudar para a próxima.

    O que há na versão atualizada

    Uma imagem aumenta o botão para o tamanho real. Você pode ver em todos os exemplos. Na versão original não há
    No próprio script há uma configuração, você pode desligar este botão.

    E os segundos que precisam da adição necessária é a exceção dos duplos das imagens.
    O padrão é desligado, você pode ativar diretamente no script, onde o botão de tamanho real é ligado.
    Na aplicação usual do script, esta função traz apenas danos, é possível usá-lo apenas em situações muito sem esperança.



    Nota, três links estão vazios, isto é, eles se referem a imagens grandes, mas não há nada entre as tags, e um link é preenchido com a imagem.
    Como resultado, apenas uma foto é vista no navegador, quando você clica nele, ele abre uma ótima foto e todas as imagens de links vazios são apertadas e você pode virar.
    E aqui, olhe, nos links existem duas fotos idênticas (destacadas em vermelho) e ao folhear, você verá duas fotos idênticas.
    Se em um exemplo concreto, ligue a remoção do duplo, depois não haverá imagens duplicadas.

    Claro, não deve haver tal situação, por que usar duas fotos idênticas e, em seguida, exclua-as. Mas estranhamente, eu corri para uma situação, as imagens duplicadas tinham que ser emitidas em uma loja on-line (havia substituições astutas de fotos por meio de scripts), e ao visualizar através da Lightbox, duplicando fotos pareciam muito erradas. Que veio em alta remoção de um duplo.

    Comentários

    11.12.2014 Victor.
    O script é muito bom. Com a ajuda do título de dados, você pode até descrever a imagem. Mas eu tive um problema, eu estava na página foi o script que apresentou a unidade no lado quando este script está conectado, desaparece. E desaparece se os scripts JS estão conectados. Eu pensei por causa da versão do conflito não por causa deles.

    05/23/2015 Victor.
    Eu não trabalho quando
    href \u003d "http://ikk.secrieru.ru/products/gallery/000039.jpg?ver\u003d20150523142822"
    Tem um tipo tão importante. Sem? Ver \u003d 20150523142822
    trabalho

    05/25/2015 KAHA.
    Muito obrigado.

    06/29/2015 Andrey.
    Muito obrigado pelo seu trabalho! Tudo ganhou quase a primeira vez)

    08/26/2015 Alexander.
    Eu tentei análogos diferentes. Sem conflito, isso se tornou imediatamente. Aumentar a origem. GUT de tamanho. Se ainda houver um mouse para levar e mover as imagens do campo - geralmente kapets

    11/01/2015 Igor.
    Olá!
    Galeria excelente. Muito obrigado.
    Apenas essa pergunta:
    No exemplo acima, os exemplos (3 imagens) da imagem são mostrados em loop. E na versão baixada do Lightbox-2.7.1, esta função não funciona. Ao visualizar a última imagem, o botão em seguida não aparece.
    Diga-me, por favor, qual poderia ser o motivo?

    17/14/2015 Anton.

    15/15/2015 Anton.
    No iOS e Android escurecendo a tela não na página inteira !!! O que poderia ser o problema. Na caixa habitual - tudo está bem!

    15/15/2015 Anton.
    No iOS e Android escurecendo a tela não na página inteira !!! O que poderia ser o problema. Na caixa habitual - tudo está bem!

    03/03/2016 Anton.
    Olá!
    É possível fazer isso para que a foto tenha aberto em maior resolução?

    11/18/2016 Yura.
    Muito obrigado! Tudo funciona perfeitamente!

    05/04/2017 Igor.
    Muito obrigado pelo roteiro! Muito há muito tempo, eu estava procurando por algo semelhante e facilmente instalado.
    Apenas por algum motivo eu tenho inscrições incompreensíveis aparecem nas imagens. Рѕ Рр ± ° ° Â ~ 8

    Talvez em algum lugar você precise consertar a codificação?

    09/12/2017 Barsuk.
    Onde você estava antes! Passei o dia inteiro para fixar a remoção do duplo))

    Eu apenas tenho página principal A precongação da imagem principal, e ela está no fundo, há menos menor que a prevalência do adicional, por causa disso, as duplicas surgiram e na galeria.

    É realmente ótimo que tenhamos acesso a mais e mais novas tecnologias da Web, com a ajuda da qual nosso trabalho será muito mais fácil. Windows modal - Um elemento funcional para exibir qualquer tipo de HTML -Content focado na criação de um design e interface convenientes.

    Nesta revisão, coletamos uma lista de bibliotecas e scripts jQuery para criar a Lightbox, que ajudará os desenvolvedores e designers a criar sites ainda melhores e profissionais.

    Você pode adicionar facilmente os scripts abaixo ao seu site. Portanto, sem mais prefácios, vamos ao tópico e considerar estes super jquery-bloblisters da Likebox, que você pode reabastecer seu arsenal.

    1. Photoswipe.

    O Photoswipe é uma galeria de fotos HTML baseada em CSS e JavaScript, orientada especificamente em dispositivos móveis. Os autores em seu desenvolvimento levaram como amostra os serviços de visualização de imagens para dispositivos móveis iOS e do Google. O Photoswipe tem um familiar e intuitivo interface compreensívelO que facilita o trabalho com imagens em um site móvel.

    Todas as principais funções são suportadas: vá para a imagem seguinte ou anterior, aumentar, arrastar, diminuir ou fechar e outros.

    2. Swipipebox.

    SwipeBox - jquery -plagin para computadores estacionários, smartphones e tablets. Ele suporta controle sensorial para dispositivos móveis, navegando no teclado para dispositivos de desktop, as transições CSS com uma alternância de backup para o controle JQuery é bastante fácil de configurar.

    O plugin foi testado em Chrome, Safari, Firefox, Opera, Internet Explorer 8 +, iOS4 +, Android, Windows Phone. Produzido sob a licença do MIT.

    3. ilightbox.

    iLightBox facilita a criação de adaptação muito bonita windows modal.Usando jquery. Combinando o suporte de uma ampla gama de conteúdo de mídia com peles magníficas e uma API conveniente, o ILightBox procura fazer a caixa de luz o mais ideal possível. O IllightBox fornece a capacidade de visualizar no modo de tela cheia, retina-peles, toque em gerenciamento, opção de integração do YouTube e Vimeo para vídeo HTML5, poderosa API JavaScript. O plugin tem suporte gratuito e versões de atualização.

    4. Caixa de luz da imagem.

    A Lightbox da imagem é um plug-in minimalista, expansível e personalizável sob o telefone IOS, Android e Windows. Você pode simplesmente baixar a seguinte imagem usando o teclado graças ao uso de transformações e transições CSS.

    5. pop-up magnífico.

    Pop-up magnífico é grátis jquery adaptativo Plugin, que é focado em assegurar a melhor interação entre o usuário e o dispositivo. Para a maioria das plagas de luz, você precisa determinar o tamanho da janela usando JS. Em magnífico pop-up, você pode usar unidades relativas de medida, como em ou alterar o tamanho da lightbox usando solicitações de mídia CSS.

    6. Lightbox do Nivo.

    O Nivo Lightbox é uma luz flexível de luz -plagina. Uma variedade de opções são oferecidas para escolher, com a qual você pode alterar facilmente a aparência da Lightbox. Por exemplo, altere o tópico, o efeito de transição e o método de navegação.

    7. Lightcase.

    A Lightcase é uma luz de luz flexível, adaptável e expansível, projetada com jQuery. Funciona ótimo em todos os navegadores populares, como Internet Explorer 7+, Firefox, Opera, Webkit e outros. O plugin suporta foto, vídeo, html5-video, iframe, swf e Ajax.

    8. Lightlayer.js.

    O LightLayer é um script para produzir a caixa de luz adaptativa, funciona bem com outros componentes em qualquer tela. Este script é realmente muito fácil de usar. O LightLayer fornece controle sobre o conjunto de parâmetros: a cor e a opacidade do fundo, a caixa de luz da posição, abrindo / fechando as transições e muitas outras funções personalizadas.

    9. strip.js.

    A tira é a Caixa de Luz, que se desdobra apenas em uma parte da página. Isso torna menos obsessivo e permite que você interaja com outros elementos da página em grandes telas; Nos dispositivos móveis do Lightbox tem um visual clássico. A tira usa jquery e é suportada em todos os principais navegadores.

    10. Fluidbox.

    A Fluidbox é um plugin jQuery projetado para implementar a Caixa de Luz Adaptativa, Ideal para Implementar, que é ideal para imagens com grande resolução. Funciona ótimo em dispositivos móveis e também pode ser aplicado em telas com mais alta resolução Para uma boa saída de imagem.

    11. Featherlight.

    Featherlight - plugin muito leve em 400 linhas javascript. , 100 linhas CSS e menos de 6kb tamanho. Caixa de luz inteligente e adaptativa, padrão suporta imagens, Ajax e iframe. Você também pode adaptá-lo às suas tarefas. Featherlight funciona no IE8 +, todos navegadores modernos e plataformas móveis.

    12. Yalb.

    Yalb é descriptografado como outra luz ( Ainda outra. Caixa de luz) - mas não é. Yalb vem com um grande conjunto de interfaces, incluindo eventos de usuário que permitem determinar sua condição ( aberto fechado).