Caixa de aviso flutuante com cookies

Detalhes da dúvida

Versão do fórum : phpBB3
Nível de acesso : Administrador
Navegador usado : Google Chrome
Membros afetados : Todos os membros do fórum
Problema começou : Recente
Endereço do fórum : http://vampiros-a-mascara.forum-livre.com/forum

Descrição do problema

Código:

<div id="fdf_float" align="center">
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#closedfstc").click(function(){
jQuery("#fdf_float").hide();
});
});
</script>
<style type="text/css">
#fdf_float a {
position: fixed;
bottom: 80px;
text-decoration: none;
right: 20px;
z-index: 3000;
}
a#caixflofstc {
position: fixed;
bottom: 10px;
line-height: 16px;
text-align: left;
right: 10px;
z-index: 1;
opacity: 0.8;
width: 360px;
height: 120px;
background: #cf3737;
color: #fff;
text-shadow: rgba(0,0,0,0.3) 0px -1px 0px;
padding: 10px;
text-decoration: none;
font-size: 11px;
font-family: Tahoma;
border: 1px solid #771b1b;
box-shadow: rgba(0,0,0,0.3) 0px 1px 4px, inset #f66c6c 0px 1px 0px;
border-radius: 3px;
}
a#caixflofstc:hover {
opacity: 1;
}
#caixflofstc strong {
font-family: "Trebuchet MS";
display: block;
font-size: 14px;
padding-bottom: 5px;
}
</style>
<a href="#" id="caixflofstc"><span id="closedfstc" style="float: right;">x</span>Conteúdo</a>
</div>

Galera eu tenho esse código. Eu queria utilizar o ajax para executar depois e marcar como lido e verificar antes de mostrar na próxima vez, como eu faria isso? Eu estou tendo algumas dificuldades. Para a mensagem não ficar incomodando constantemente, entendem?

Boa tarde!

Eu não compreendi bem sua questão. Você quer um script que marca os tópicos como lidos para não incomodar os membros, é isso?

https://ajuda.forumeiros.com/t94640-tutorial-caixa-de-aviso-flutuante

temos essa caixa de aviso flutuante, eu tentei modificar o codigo, porem não é meu forte, com o objetivo de usar cookies para que os membros possam marcar o aviso como lido e não virar um pop-up constante

Bom dia!

Troque seu código por:

Código:

<!--    INICIO DA POP-UP SHEK  http://ajuda.forumeiros.com/t96138-  --><style>#topbar{
position:absolute;
line-height: 16px;
text-align: left;
right: 10px;
opacity: 0.8;
background: #cf3737;
color: #fff;
cursor: pointer;
text-shadow: rgba(0,0,0,0.3) 0px -1px 0px;
padding: 10px;
text-decoration: none;
font-size: 11px;
font-family: Tahoma;
border: 1px solid #771b1b;
box-shadow: rgba(0,0,0,0.3) 0px 1px 4px, inset #f66c6c 0px 1px 0px;
border-radius: 3px;
margin: 100px 0px 0px 200px;
font-size:12px;
width: 400px;
visibility: hidden;
z-index: 400;}

#topbar:hover{
opacity: 100;
}

.closet-shek a {
color: #FFF !important;
}
</style>
<script type="text/javascript">
var persistclose=1
var startX = 20
var startY = 5
var verticalpos="fromtop"
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script><br />
<!--    Java PopUp Final    -->
<!--    conteudo PopUp Inicio    -->
<div id="topbar">
      
   <p class="closet-shek" align="right">
        <a href="" onclick="closebar(); return false">X</a> 
   </p>
      
   <p align="center">
        CONTEÚDO DA POP 
   </p>
</div>
<!--    FIM DA POP-UP SHEK  http://ajuda.forumeiros.com/t96138-  -->

Atenciosamente,
Shek

Muito obrigado, poderia apenas para finalizar citar a parte que mostra o alocamento da posição do pop-up para que eu coloque na lateral direta inferior da tela? E caso eu desejasse escrever outra mensagem quanto tempo seria excluído dos cookies para a nova mensagem aparecer?

Bom dia!

Troque o código por este:

Código:

   
<!--      INICIO DA POP-UP SHEK  http://ajuda.forumeiros.com/t96138-    --><style>#topbar {
    top: 75% !important; /* MUDAR O VALOR PRA DEFINIR A POSIÇÃO DA CAIXA PARA CIMA OU PARA BAIXO */
    left: 53% !important; /* MUDAR O VALOR PRA DEFINIR A POSIÇÃO DA CAIXA ESQUERDA OU DIREITA */
    position: absolute;
    line-height: 16px;
    text-align: left;
    opacity: 0.8;
    background: none repeat scroll 0% 0% #CF3737;
    color: #FFF;
    cursor: pointer;
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.3);
    padding: 10px;
    text-decoration: none;
    font-family: Tahoma;
    border: 1px solid #771B1B;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 1px 0px #F66C6C inset;
    border-radius: 3px;
    margin: 100px 0px 0px 200px;
    font-size: 12px;
    width: 400px;
    visibility: hidden;
    z-index: 400;
}

    #topbar:hover{
    opacity: 100;
    }

    .closet-shek a {
    color: #FFF !important;
    }
    </style>    <script type="text/javascript">
    var persistclose=1
    var startX = 20
    var startY = 5
    var verticalpos="fromtop"
    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }
    function get_cookie(Name) {
    var search = Name + "="
    var returnvalue = "";
    if (document.cookie.length > 0) {
    offset = document.cookie.indexOf(search)
    if (offset != -1) {
    offset += search.length
    end = document.cookie.indexOf(";", offset);
    if (end == -1) end = document.cookie.length;
    returnvalue=unescape(document.cookie.substring(offset, end))
    }
    }
    return returnvalue;
    }
    function closebar(){
    if (persistclose)
    document.cookie="remainclosed=1"
    document.getElementById("topbar").style.visibility="hidden"
    }
    function staticbar(){
    barheight=document.getElementById("topbar").offsetHeight
    var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
    var d = document;
    function ml(id){
    var el=d.getElementById(id);
    if (!persistclose || persistclose && get_cookie("remainclosed")=="")
    el.style.visibility="visible"
    if(d.layers)el.style=el;
    el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
    el.x = startX;
    if (verticalpos=="fromtop")
    el.y = startY;
    else{
    el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
    el.y -= startY;
    }
    return el;
    }
    window.stayTopLeft=function(){
    if (verticalpos=="fromtop"){
    var pY = ns ? pageYOffset : iecompattest().scrollTop;
    ftlObj.y += (pY + startY - ftlObj.y)/8;
    }
    else{
    var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
    ftlObj.y += (pY - startY - ftlObj.y)/8;
    }
    ftlObj.sP(ftlObj.x, ftlObj.y);
    setTimeout("stayTopLeft()", 10);
    }
    ftlObj = ml("topbar");
    stayTopLeft();
    }
    if (window.addEventListener)
    window.addEventListener("load", staticbar, false)
    else if (window.attachEvent)
    window.attachEvent("onload", staticbar)
    else if (document.getElementById)
    window.onload=staticbar
    </script><br />   
<!--      Java PopUp Final      -->   
<!--      conteudo PopUp Inicio      -->   
<div id="topbar">
                    
   <p class="closet-shek" align="right">
                  <a href="" onclick="closebar(); return false">X</a>       
   </p>
                    
   <p>
                  CONTEÚDO DA POP         
   </p>
      
</div>
   
<!--      FIM DA POP-UP SHEK  http://ajuda.forumeiros.com/t96138-    -->

Eu deixei especificado nas primeiras linhas do CSS o local que deverá mudar:

Código:

    top: 75% !important; /* MUDAR O VALOR PRA DEFINIR A POSIÇÃO DA CAIXA PARA CIMA OU PARA BAIXO */
    left: 53% !important; /* MUDAR O VALOR PRA DEFINIR A POSIÇÃO DA CAIXA ESQUERDA OU DIREITA */

Até!