Abrir página em lightbox Hitskin_logo Hitskin.com

Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o temaVoltar para a ficha do tema

Abrir página em lightbox

2 participantes

Ir para baixo

Tópico resolvido Abrir página em lightbox

Mensagem por Shaman 12/11/15, 05:28 pm

Detalhes da questão


Endereço do fórum: http://maniagamer.forum-pro.net/
Versão do fórum: PunBB

Descrição


Olá, muito tempo sem postar dúvidas aqui, gostaria de pedir ajuda dos desenvolvedores para isso, estou estudando lightbox agora, e fiz um sistemazinho bacana, de uma loja, para meu fórum como podem ver aqui: http://maniagamer.forum-pro.net/h10-

Ao clicar em ABRIR LOJA, a mesma abre em LIGHTBOX, mas eu gostaria de abrir a mesma, somente clicando no botão no menu "seja sócio", estou quebrando a cabeça aqui com isso, os senhores sabem fazer isso de alguma maneira?

Código que criei:

Código:
$(document).ready(function(){
 $('.lightbox').click(function(){
 $('.background, .boxlig').animate({'opacity':'.60'}, 500, 'linear');
 $('.boxlig').animate({'opacity':'1.00'}, 500, 'linear');
 $('.background, .boxlig').css('display', 'block');
 });
});

$(function(){
$('.close').click(function(){
 $('.background, .boxlig').animate({'opacity':'0'}, 500, 'linear', function(){
 $('.background, .boxlig').css('display', 'none');
 });
 });
});

$(function(){
$('.background').click(function(){
 $('.background, .boxlig').animate({'opacity':'0'}, 500, 'linear', function(){
 $('.background, .boxlig').css('display', 'none');
 });
 });
});

ID do botão seja sócio é nav_app_store.

Muito obrigado!


Última edição por Shaman em 12/11/15, 07:07 pm, editado 1 vez(es)
Shaman
Shaman
Super Membro

Membro desde : 30/01/2014
Mensagens : 1787
Pontos : 2448

http://brasilplayvicio.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: Abrir página em lightbox

Mensagem por MateusAnjosV 12/11/15, 05:54 pm

Boa tarde!

Eu sei que estou me metendo, sorry. Espero estar ajudando, apesar se não ser um dos desenvolvedores e o senhor ter deixado claro que almejava a ajuda deles.


Spoiler:

Lamento por me meter e caso não seja isso, explique melhor, caso deseje que eu tente te ajudar.

Abraço!
MateusAnjosV.
MateusAnjosV
MateusAnjosV
Super Membro

Membro desde : 16/10/2015
Mensagens : 1718
Pontos : 2373

http://holder.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Abrir página em lightbox

Mensagem por Shaman 12/11/15, 06:04 pm

Opa, claro que não, pode me responder sim Muito feliz coloquei os desenvolvedores pôs são os mais experientes no assunto, mas qualquer um pode responder Feliz
Bom o código não deu certo, quero que abra a página /h10- em lightbox ao clicar no botão do menu "seja sócio" e não consigo fazer isso ^^
Obrigado!
Shaman
Shaman
Super Membro

Membro desde : 30/01/2014
Mensagens : 1787
Pontos : 2448

http://brasilplayvicio.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: Abrir página em lightbox

Mensagem por MateusAnjosV 12/11/15, 06:32 pm

Entendo a sua teoria @Shaman, mas pense só em um detalhe: eles foram membros antes, rs.


Teoricamente, o código funcionou e eu notei que o retirou, porém, só funcionou dentro do /h10 e pelo que notei, deseja em todo fórum.
Experimente esse js, em todas as páginas:
Código:
$(document).ready(function(){
$('#primary_nav').after('<div id="mateusanjos" class="background"></div><div class="boxlig"><div class="close">x</div></div> <style>.shopWrapper { width: 837px; text-align: center; margin: 0px auto; overflow: hidden; height: auto; border: 1px solid rgb(207, 207, 207); background: whiteSmoke; } .inventWrapper { width: 850px; height: auto; overflow: hidden; } .type_header { -webkit-box-shadow: none !important; margin: 0px; padding: 10px 0px; font-style: normal; font-variant: normal; font-weight: normal; font-size: 12px; line-height: normal; font-family: arial, helvetica, sans-serif; color: white; background-color: #262626; border: 1px solid #6E6A65; background-repeat: repeat no-repeat; width: 100%; } .itemWrapper { text-align: center; margin: 0 auto; float: left; } .item { width: 201px; min-height: 195px; border: 1px solid #CECECE; overflow: hidden; height: 330px; padding: 33px; background: #fff; text-align: center; margin: 5px; } .type_header { -webkit-box-shadow: none !important; margin: 0px; padding: 10px 0px; font-style: normal; font-variant: normal; font-weight: normal; font-size: 12px; line-height: normal; font-family: arial, helvetica, sans-serif; color: white; background-color: #262626; border: 1px solid #6E6A65; background-repeat: repeat no-repeat; width: 100%; } #checkout { float: left; height: 425px; text-align: center; background: white; font-size: 17pt; padding: 10px; margin: 10px; width: 95%; } .image img { padding-top: 13px; height: 200px; width: 187px; } .descrip { float: left; margin-left: -10px; padding-left: 15px; padding-right: 15px; padding-top: 5px; padding-bottom: 5px; background: #E9E9E9; border: 1px solid #CECECE; width: 92.3%; text-align: left; margin-top: 30px; margin-bottom: 15px; } .points { background: url(http://s6.tinypic.com/286sfuu_th.jpg) no-repeat; padding-bottom: 5px; padding-left: 18px; color: #242424; font-weight: bold; font-size: 11px; float: left; text-align: center; } .sale { color: green; font-style: italic; font-size: 11px; float: right; text-align: center; } .description { color: #242424; font-size: 11px; word-wrap: break-word; text-align: left !important; float: left; text-indent: 11px; } .background{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: .0; background-color: #000000; -moz-opacity: .0; filter:alpha(opacity=0); z-index:100; display: none; } .boxlig { position: absolute; top: 10%; left: 30%; width: 835px; height: 1390px; background-color: #FFFFFF; z-index: 101; padding: 14px; margin-bottom: 5px; box-shadow: 2px 2px 2px #333333; -moz-box-shadow: 2px 2px 2px #333333; -webkit-box-shadow: 2px 2px 2px #333333; display: none; } .close{ float: right; margin-right: 10px; cursor: pointer; font-size: 35px; margin-bottom: 20px; margin-left: 50px; } #Lightbox { vertical-align:middle; position:fixed; }</style>'); 
$('.close').click(function(){
      $('.background, .boxlig').animate({'opacity':'0'}, 500, 'linear', function(){
         $('.background, .boxlig').css('display', 'none');
      });
   }); 
$('.background').click(function(){
      $('.background, .boxlig').animate({'opacity':'0'}, 500, 'linear', function(){
         $('.background, .boxlig').css('display', 'none');
      });
   });  $.get('/h10-', function(bod){var t =  $('.shopWrapper', bod).html(); $('.boxlig').append('<div class="shopWrapper"> '+t+' </div>'); });

$('#nav_app_store').click(function(e){e.preventDefault(); $('.background, .boxlig').animate({'opacity':'.60'}, 500, 'linear');
  $('.boxlig').animate({'opacity':'1.00'}, 500, 'linear');
  $('.background, .boxlig').css('display', 'block');
  });

});

Aqui funcionou, espero que funcione ai.

Feliz
MateusAnjosV
MateusAnjosV
Super Membro

Membro desde : 16/10/2015
Mensagens : 1718
Pontos : 2373

http://holder.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Abrir página em lightbox

Mensagem por Shaman 12/11/15, 06:45 pm

Opa, funcionou legal e.e, o CSS deu uma bagunçada mas isso eu arrumo aqui!! Também vou estudar seu código, pôs estou voltando com JQuery agora, estava estudando c++, mas ai precisei mexer no forum ^^, mais uma vez muito obrigado!
Shaman
Shaman
Super Membro

Membro desde : 30/01/2014
Mensagens : 1787
Pontos : 2448

http://brasilplayvicio.com.br

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos