Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais
Login

Esqueci minha senha

Últimos assuntos
» Pinta ícone
Hoje à(s) 4:48 por Smoke.xX

» Remover ver mensagens
Hoje à(s) 3:10 por while

» Borda no rank de adms
Hoje à(s) 3:07 por while

» Novo tópico sem Refresh
Hoje à(s) 1:59 por iScroll

» Ajuda com Botão Curtir
Hoje à(s) 1:54 por TZero

» Alterar espaçamento entre tópicos e alterar posições dos respectivos titulos
Hoje à(s) 0:41 por Kyou

» Personalizar a barra de menu
Ontem à(s) 23:06 por Cepheus

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Parceiros Forumeiros
Os membros mais ativos da semana
fiapinho
 
while
 
Kyou
 
Smoke.xX
 
w204
 
Holkis
 
TZero
 
iScroll
 

Quem está conectado
182 usuários online :: 1 usuário cadastrado, Nenhum Invisível e 181 Visitantes :: 1 Motor de busca

TZero

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

Abrir página em lightbox

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Abrir página em lightbox

Mensagem por Shaman em Qui 12 Nov 2015 - 15:28

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 Qui 12 Nov 2015 - 17:07, editado 1 vez(es)

Shaman
Membro do Fórum

Masculino
Inscrito dia : 30/01/2014
Mensagens : 1784
Pontos Ativos : 3565

http://www.nexplorer.tk https://www.facebook.com/https://www.facebook.com/pages/Nexplorer/857666487628799?fref=ts

Resolvido Re: Abrir página em lightbox

Mensagem por MateusAnjosV em Qui 12 Nov 2015 - 15:54

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:
Se quiser que abra no "Seja sócio" e no "ABRA A LOJA", apenas acrescente esse script:
Código:
$(document).ready(function(){
$('#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');
   });
});


Se quiser substituir o click de "ABRA A LOJA", para  "Seja sócio", no caso, procure por  isso nas primeiras linhas do seu código:
Código:
$('.lightbox').click(function(){
   $('.background, .boxlig').animate({'opacity':'.60'}, 500, 'linear');
   $('.boxlig').animate({'opacity':'1.00'}, 500, 'linear');
   $('.background, .boxlig').css('display', 'block');
   });
Troque por:
Código:
$('#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');
   });

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

Abraço!
MateusAnjosV.

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1417
Pontos Ativos : 2470

http://ajuda.forumeiros.com/

Resolvido Re: Abrir página em lightbox

Mensagem por Shaman em Qui 12 Nov 2015 - 16:04

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
Membro do Fórum

Masculino
Inscrito dia : 30/01/2014
Mensagens : 1784
Pontos Ativos : 3565

http://www.nexplorer.tk https://www.facebook.com/https://www.facebook.com/pages/Nexplorer/857666487628799?fref=ts
  • 0

Resolvido Re: Abrir página em lightbox

Mensagem por MateusAnjosV em Qui 12 Nov 2015 - 16:32

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
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1417
Pontos Ativos : 2470

http://ajuda.forumeiros.com/

Resolvido Re: Abrir página em lightbox

Mensagem por Shaman em Qui 12 Nov 2015 - 16:45

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
Membro do Fórum

Masculino
Inscrito dia : 30/01/2014
Mensagens : 1784
Pontos Ativos : 3565

http://www.nexplorer.tk https://www.facebook.com/https://www.facebook.com/pages/Nexplorer/857666487628799?fref=ts

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum