Caixa do blog

Qual é sua questão:
Bom eu fui visitar o blog shiftactive e me notei um efeito muito interessante que era uma caixa tipo "POP UP"

a caixa aparecia e o fórum fica um preto claro que não podia clicar em nada até "Fechar a caixa" e eu gostaria de obter aquela caixa pop up alguém poderia me passar ela? mais para fórum forumeiros

Que medidas você tomou para corrigir o problema:
Vim aqui

Apresente-nos imagens do problema (se necessário):
Não é necessário!

Olá!

Lamento, mas o código não é adaptável para fóruns ainda. Mas, vamos fornecer o código usado para adição do efeito: http://variasdicasparablogs.blogspot.com.br/2012/10/janela-popup-curtir-fan-page-do.html

Ela funciona para páginas HTML, mas estamos desenvolvendo o código para funcioná-la para fóruns, o que pode demorar, já que nossa equipe técnica está com outras tarefas em curso.

Atenciosamente,

Então tem como me passar para blog que eu converto ela para fórum héhé

Olá!

Como assim? O mesmo código dito no artigo acima é o que usamos no blog.

Atenciosamente,

kkk eu nem notei o LINK kkk malz ai deixa o tópico aberto por favor vai que alguma alma desocupada pode fazer isso para mim né

Olá Style!

Por favor, faça alguns testes e veja se é o que precisa:
PA > Visualização > Imagens e Cores > Cores > Folha de estilo CSS > e adicione o código CSS:

Código:

/* Modal ShiftActif */
/* Mascara de fundo */
#mask {
position:absolute;
top: 0px;
left: 0px;
background-color:#000;
display:none;
}

#boxes .window {
position:fixed;
width:440px;
height:200px;
display:none;
z-index: 999;
padding:20px;
border-radius: 3px 3px 3px 3px;
}

/* Personalize a janela modal aqui. Você pode adicionar uma imagem de fundo. */
#boxes #dialog {
background-color: #FFF;
width:290px;
height:275px;
}
/* posiciona o link para fechar a janela */
.close {
display:block;
text-align:right;
} 
/* Modal ShiftActif - FIM */

Logo após, queira acessar um widget personalizado ou qualquer local que aceite o HTML e Script entre as tags e adicione o seguinte código:

Código:

<script src='http://yourjavascript.com/1029251148/jquery.min.js'></script>
<script src="http://file.xp3.biz/js/modal-sa.js" type="text/javascript"></script>
<script src="http://file.xp3.biz/js/modal-open-window.js" type="text/javascript"></script>

<!-- #dialog é o id do DIV definido como mostrado a seguir  -->
<a href="#dialog" name="modal" >Curta ShiftActif no Facebook</a>
<div id="boxes"><!-- #personalize sua janela modal aqui --><div id="dialog" class="window">
<a href="#" class="close">Fechar [X]</a><br />
<center><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FShiftActif&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe></center></div>

<!-- Não remova o div#mask, pois ele é necessário para preencher toda a janela --><div id="mask"></div>
</div>

Dentro do IFRAME procure pelo nome:

ShiftActif

E mude para o nome da sua página no Facebook. Do lado de fora, prescione o Ctrl + F e encointre:

Curta ShiftActif no Facebook

Modifique o texto de dentro para o que desejar.

Atenciosamente,

Gombor o código pego uma parte mais não é assim que eu quero


Eu quero um fundo totalmente preto por baixo da caixa que onde tem o curtir no facebook que nem no blog que não da para clicar e ver em nada até curtir a página entende pode me ajudar?

Mas o código do blog você não precisa curtir para acessá-lo. Existe uma imagem com um X na qual você clica e ela é fechada. Infelizmente o Model e os scripts que adicionamos não suportam o efeito porque o código não é o mesmo dos blogs.

Então vamos fazer assim

Sabe as Pop up ele abre uma caixa


eu quero uma Pop up que tem pede Login e Senha e não tem nada de registrar ou ir para a página de login e quero que um fundo totalmente preto até ele não fazer o login ele não consegue acessar nada entende?

---

E FELIZ NATAL PARA VOCÊ QUE ESTAR LENDO

Olá!

O nosso parceiro ToxiGreek tem o tutorial relacionado: http://toxigeek.com/foroactivo/fancybox-para-foroactivo.html

Atenciosamente,

Gombor eu preciso registrar la e eu não quero registrar será que tem como você me passar o código da caixa de login aqui para mim?

Olá!

O tutorial está protegido por direitos autoriais de Giobanni. Não podemos postar o código sem permissão dele. Entrei em contato com ele, e peço que aguarde até ele lhe responder.

Atenciosamente,

OK, irei aguardar

Olá!

A permissão foi concedida. Contudo, não modifique os créditos devidos de dentro do código!

Código:

// Tipo de fancyBox: "all" o "images"
var typefancyBox='all';
 
eval(function(p,a,c,k,e,r){e=function(c){return c.toString(a)};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('1.2(\'<g h="i" j="3://4-5.6.7/8/9/0/a-b.0" c="d/0" />\\n\');1.2(\'<e k="3://4-5.6.7/8/9/f/a-b-\'+l+\'.f" c="d/m"></e>\\n\');',24,24,'css|document|write|http|scripts|giobanii|googlecode|com|svn|trunk|forumotion|facybox|type|text|script|js|link|rel|stylesheet|href|src|typefancyBox|javascript|'.split('|'),0,{}))

Compreendendo mais sua questão, eu pude notar que o que deseja não seria possível com o Facybox que viu no nosso blog. Para chegar ao resultado esperado, basta editar o script: <script src="http://file.xp3.biz/js/modal-sa.js" type="text/javascript"></script>

Atenciosamente,


Atenciosamente,

Gombor sem resultados vamos explicar mais como eu quero o código acho que tem como fazer com BBCode e HTML

---

Eu quero uma pop up de login e quero que a pop up não tenha a opção de fechar pop up e quero o fundo totalmente preto para eu colocar em qual tópico entende

e se for possível colocar uma Pop up que o Admin pode modificar o login e a senha mais não o Login e Senha do usuário um login criado por Admin entende? tipo colocar senha nos sub fóruns permite modificar o login e senha entende como eu quero?

Sim, compreendo. Isso se faz com PHP: http://forum.imasters.com.br/topic/397172-painel-de-controle-de-clientes-em-php-mysql/page__view__findpost__p__1552529 Com o JS o mínimo que podemos fazer é ajustar o lightbox.

Gombor olha como eu quero, eu quero um código que eu possa colocar em algum tópico quando o membro fazer o login ele a Pop up e o fundo preto suma e ele consegue ver o conteúdo do tópico

como irar ficar sem o login

https://2img.net/h/oi46.tinypic.com/34j7uhs.png

sem o login o tópico vai ficar normal entende poderia me mandar um código pro efeito?

Olá,

Crie um novo código javascript com o investimento marcado "Nos tópicos" e com este código:

Código:

$(function() {
        var tgl = document.getElementById('i_icon_mini_login'); if(!tgl) return; var tgu = document.location.href;
if(jQuery('#i_icon_mini_login').length){$('body').append('<div id="TGlogin_form" class="TGlogin_form-float" style="display: bloxk;"><div class="TGlogin_form-float-content"><div class="TGlogin_form-float-div"><form  id="TGloginform" method="post" method="post" action="/login?redirect='+tgu+'"><label><em>Login : </em><input id="username" type="text" name="username"></label><label><em>Senha : </em><input id="password" type="password" name="password"></label><label style="float: left; margin-top: 5px; text-align: left;"><em style="margin-right: 10px; margin-top: 3px; width: 85px; margin-left: 7px;">Lembrar a senha? : </em><input type="checkbox" name="autologin" checked="true" style="width: 20px;"></label><input id="submit" type="submit" name="login" value="Entrar" class="submit"></form></div></div><span class="TGClose" style="display:none;">X</span></div><div id="TGfade" class="TGlogin_form-float_overlay"></div>'); }var Copyrights = 'Forum dos Foruns - ©Mikee All Rights Reserved.'; $('a[href="/login"], a[href="/login?connexion"]').attr('href', '/login').click(function (e) { $('#TGlogin_form').fadeToggle('slow',  'linear'); return false; }).click(function(e) {$('#TGfade').css('display', 'block' ); $('#TGlogin_form').css('left', '40%').css('top', '40%'); }); $('.TGClose').click(function() { $('#TGlogin_form, #TGfade').fadeToggle("slow", "linear"); });
        });

Feito isto salve e ponha o código abaixo em sua folha de estilo CSS:

Código:

#TGlogin_form {position: fixed;z-index: 999; height: 130px; padding: 0; verflow: auto;  width: 330px; margin: 0; background: #f9f9f9; color: #444; /* ©Copyright by giObanii.*/ text-shadow: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);}
        .TGlogin_form-float-content{width: 320px; height: 120px; background: none repeat scroll 0% 0% transparent;}
        .TGlogin_form-float-div {background: url("http://i31.servimg.com/u/f31/17/41/76/40/2jci9c10.jpg") no-repeat scroll left center transparent;margin: 0 auto;padding: 20px 0 0 60px;width: 250px;}
        .TGlogin_form-float-div label {font-family: Verdana;display: block;font-size: 12px;padding-bottom: 5px;text-align: right;}
        .TGlogin_form-float-div label em {color: #000000;font-family: Verdana;display: block;float: left;font-style: normal;width: 80px;font-size: 12px;text-align: right;}
        .TGlogin_form-float-div input {border: 1px solid #CCCCCC;height: 22px;width: 146px;}
        .TGlogin_form-float-div input.submit {background: url("http://i31.servimg.com/u/f31/17/41/76/40/eumpmp10.jpg") repeat-x scroll 0 0 #DDDDDD;padding: 3px 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;border: 1px solid #BBB;float: right;height: auto;width: auto;}
        .TGlogin_form-float-div input.submit:active {position:relative; top: 1px;}
        .TGlogin_form-float-div input.submit:hover, .TGlogin_form-float-div input.submit:focus {cursor:pointer;color:#000;}
        .TGlogin_form-float_overlay{display: none;position:fixed;top: 0%;left: 0%;width: 100%;height: 100%; background-color: black;z-index: 9;-moz-opacity: 0.8;opacity:.80;filter: alpha(opacity=80);}
        #TGlogin_form .TGClose {cursor: pointer;bottom: 3px;color: #000000;font-size: 15px;font-weight: 700;position: absolute;right: 5px;}
        #TGlogin_form .TGClose:active {color: #FF0000 !important;bottom: 2px;}

Abraços.

Eu não obtive resultados MateusV.

E eu quero que o Login e Senha seja padrão por exemplo
Login: Teste
Senha: Teste

e eu quero em tópico escolhido para não ficar em todos os tópicos entende?

Poderia me ajudar

---

EDIT: 9:03 29/12/12

Olha aqui para vocês ver vocês podem perceber que você pode clicar só dentro da caixa fora da caixa vocês não consegue até curtir a página certo, mais eu não quero que curta a minha página eu quero obter esse resultado somente em tópicos vip do meu fórum que é /f5 e /f6

dentro dos tópicos desses fóruns mais eu quero que dentro dessa caixa tenha o Login e Senha padrão escolhido por mim 'Admin' e toda hora que eu quiser mudar a senha eu possa mudar pois não irar ser senha de usuários serão senha da minha imaginação e o fundo ai é um cinza transparente e eu quero um preto que não consiga visualizar nem uma palavra tipo um Owner entende alguém poderia me ajudar?

Olá,

Adicione este Javascript(investimento marcado nos tópicos):

jQuery(document).ready(function(){var i='1',p='USUARIO',o='SENHA';if(location.pathname.split('t')[1].split('-')[0]==i){jQuery('body').prepend('<div id="fundo"></div><div id="contlogin"><div id="erro" style="display:none;"><img src="http://png-2.findicons.com/files/icons/2165/office/48/close.png" class="imgerro"><div class="msgerro"> O nome de usuário ou senha estão incorretos!</div></div><div class="campos"><label>Usuário: <input type="text" id="usernamel"></label><br><br><label>Senha: <input type="text" id="senhal"></label><br><input type="button" id="logarl" value="Entrar"> ou <a href="/forum">cancelar</a></div></div>');jQuery('#logarl').click(function(){if(jQuery('#senhal').val()==o&&jQuery('#usernamel').val()==p){jQuery('#fundo,#contlogin').remove();}else{jQuery('#erro').fadeIn();jQuery('#senhal,#usernamel').val('');}});}});

Azul -> Número do tópico que irá aparecer.
Vermelho -> Nome de usuário.
Verde -> Senha.

E este CSS (em sua folha de estilo CSS):

Código:

#contlogin {
    position: fixed;
    left: 40%;
    top: 40%;
    z-index: 99999!important;
    height: 200px;
    background: white;
    padding: 7px;
    padding-top: 40px;
    width: 400px;
    font-family: "Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue","BBAlpha Sans","S60 Sans",Arial,"sans-serif";
    font-size: 13px;
    border: 1px solid black;
    box-shadow: 3px 3px 5px gray;
}
#fundo {
    background: rgba(143, 143, 143,.5);
    left: 0;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 99999!important;
}
#usernamel,#senhal {
    outline: none;
    text-align: center;
    padding: 3px;
    cursor: text;
}
#senhal {
    margin-left: 10px;
}
#contlogin label {
    padding: 3px;
}
#erro {
    background: rgb(255, 169, 169);
    color: white;
    height: 35px;
    padding: 5px;
    padding-top: 16px;
    margin-bottom: 10px;
    margin-top: -30px;
    border: 1px solid red;
}
.imgerro {
    position: absolute;
    margin-top: -11px;
}
.msgerro {
    margin-left: 60px;
    font-weight: bold;
    color: red;
}
#logarl {
    padding: 3px;
    background: white;
    border: 1px solid rgb(182, 182, 182);
    border-radius: 3px;
    color: rgb(119, 119, 119);
}
#logarl:hover {
    color: white;
    background: rgb(182, 182, 182);
}

Atenciosamente.

Resulto, estamos quais la!

Mais MateusV. tem como eu deixar a caixa de login como eu mostrei la o fundo ta transparente eu quero preto agora é só personalizar o código

StyLe® escreveu:Resulto, estamos quais la!

Mais MateusV. tem como eu deixar a caixa de login como eu mostrei la o fundo ta transparente eu quero preto agora é só personalizar o código

Olá,

Não compreendi direito, eu criei o código para diminuir a opacidade de fundo e ter um efeito de "transparência", todavia, poderia me especificar como deseja?

Abraços.

Eu desejo o fundo preto totalmente preto para ninguém conseguir visualizar até fazer o login entende?

Olá,

Substitua o código CSS por este:

Código:

#contlogin {
    position: fixed;
    left: 40%;
    top: 40%;
    z-index: 99999!important;
    height: 200px;
    background: white;
    padding: 7px;
    padding-top: 40px;
    width: 400px;
    font-family: "Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue","BBAlpha Sans","S60 Sans",Arial,"sans-serif";
    font-size: 13px;
    border: 1px solid black;
    box-shadow: 3px 3px 5px gray;
}
#fundo {
    background:rgb(141, 141, 141);
    left: 0;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 99999!important;
}
#usernamel,#senhal {
    outline: none;
    text-align: center;
    padding: 3px;
    cursor: text;
}
#senhal {
    margin-left: 10px;
}
#contlogin label {
    padding: 3px;
}
#erro {
    background: rgb(255, 169, 169);
    color: white;
    height: 35px;
    padding: 5px;
    padding-top: 16px;
    margin-bottom: 10px;
    margin-top: -30px;
    border: 1px solid red;
}
.imgerro {
    position: absolute;
    margin-top: -11px;
}
.msgerro {
    margin-left: 60px;
    font-weight: bold;
    color: red;
}
#logarl {
    padding: 3px;
    background: white;
    border: 1px solid rgb(182, 182, 182);
    border-radius: 3px;
    color: rgb(119, 119, 119);
}
#logarl:hover {
    color: white;
    background: rgb(182, 182, 182);
}

Melhores cumprimentos.

MateuV. se for possível o botão Cancelar tiver o mesmo efeito que o Entrar eu fico grato é possível?

StyLe® escreveu:MateuV. se for possível o botão Cancelar tiver o mesmo efeito que o Entrar eu fico grato é possível?

Olá,

Substitua novamente o seu código CSS por este:

Código:

#contlogin {
    position: fixed;
    left: 40%;
    top: 40%;
    z-index: 99999!important;
    height: 200px;
    background: white;
    padding: 7px;
    padding-top: 40px;
    width: 400px;
    font-family: "Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue","BBAlpha Sans","S60 Sans",Arial,"sans-serif";
    font-size: 13px;
    border: 1px solid black;
    box-shadow: 3px 3px 5px gray;
}
#fundo {
    background: rgb(143, 143, 143);
    left: 0;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 99999!important;
}
#usernamel,#senhal {
    outline: none;
    text-align: center;
    padding: 3px;
    cursor: text;
}
#senhal {
    margin-left: 10px;
}
#contlogin label {
    padding: 3px;
}
#erro {
    background: rgb(255, 169, 169);
    color: white;
    height: 35px;
    padding: 5px;
    padding-top: 16px;
    margin-bottom: 10px;
    margin-top: -30px;
    border: 1px solid red;
}
.imgerro {
    position: absolute;
    margin-top: -11px;
}
.msgerro {
    margin-left: 60px;
    font-weight: bold;
    color: red;
}
#logarl,#contlogin a[href="/forum"] {
margin-top:10px;
    padding: 3px;
    background: white;
    border: 1px solid rgb(182, 182, 182);
    border-radius: 3px;
    color: rgb(119, 119, 119);
}
#logarl:hover,#contlogin a[href="/forum"]:hover {
    color: white;
    background: rgb(182, 182, 182);
}

Melhores cumprimentos.

Agora o fundo estar transparente e não preto

StyLe escreveu:Agora o fundo estar transparente e não preto

Olá, me perdoe, esqueci de retirar a propriedade de opacidade, substitua o CSS por este:

Código:

#contlogin {
    position: fixed;
    left: 40%;
    top: 40%;
    z-index: 99999!important;
    height: 200px;
    background: white;
    padding: 7px;
    padding-top: 40px;
    width: 400px;
    font-family: "Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue","BBAlpha Sans","S60 Sans",Arial,"sans-serif";
    font-size: 13px;
    border: 1px solid black;
    box-shadow: 3px 3px 5px gray;
}
#fundo {
    background: rgb(143, 143, 143);
    left: 0;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 99999!important;
}
#usernamel,#senhal {
    outline: none;
    text-align: center;
    padding: 3px;
    cursor: text;
}
#senhal {
    margin-left: 10px;
}
#contlogin label {
    padding: 3px;
}
#erro {
    background: rgb(255, 169, 169);
    color: white;
    height: 35px;
    padding: 5px;
    padding-top: 16px;
    margin-bottom: 10px;
    margin-top: -30px;
    border: 1px solid red;
}
.imgerro {
    position: absolute;
    margin-top: -11px;
}
.msgerro {
    margin-left: 60px;
    font-weight: bold;
    color: red;
}
#logarl,#contlogin a[href="/forum"] {
margin-top:10px;
    padding: 3px;
    background: white;
    border: 1px solid rgb(182, 182, 182);
    border-radius: 3px;
    color: rgb(119, 119, 119);
}
#logarl:hover,#contlogin a[href="/forum"]:hover {
    color: white;
    background: rgb(182, 182, 182);
}

Lamento o inconveniente, abraços.

MateusV. escreveu:

StyLe® escreveu:Agora o fundo estar transparente e não preto

Olá, me perdoe, esqueci de retirar a propriedade de opacidade, substitua o

Te perdoar de que? que nada eu que tenho que lhe agradecer muito obrigado

Resolvido