V
Vyrix
Curioso
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola, necesito una ayuda en algo que no tengo mucho conocimiento, primero que nada he visto que en muchos foros tienen la opción de "Hide" la cual te obliga a registrarte para ver el contenido oculto, al ver eso quise hacer un botón tipo "Social Locker" para pobres. :carcajadas:
El cual consiste un un código simple de "Mostrar/Ocultar" pero que al hacer click te envía al sitio que desees y a la vez te muestra el contenido oculto.
El botón se ve así. Demo aquí
El punto es, que quiero incorporarlo en un foro donde soy miembro, pero no se como convertirlo a PHP, como dije, no tengo conocimiento en eso, los códigos son los siguientes:
Código del estilo:
Y el del post es este:
No sé si eso sea posible, y gracias. 🙂
El cual consiste un un código simple de "Mostrar/Ocultar" pero que al hacer click te envía al sitio que desees y a la vez te muestra el contenido oculto.
El botón se ve así. Demo aquí
El punto es, que quiero incorporarlo en un foro donde soy miembro, pero no se como convertirlo a PHP, como dije, no tengo conocimiento en eso, los códigos son los siguientes:
Código del estilo:
HTML:
a.demo_b_d {
background-color:#b20000;
font-family: 'Open Sans', sans-serif;
font-size:12px;
text-decoration:none;
color:#ffffff;
position:relative;
padding:10px 20px;
padding-right:50px;
background-image: linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -o-linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -moz-linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -ms-linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, rgb(147,0,0)),
color-stop(1, rgb(188,0,0))
);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: inset 0px 1px 0px #600202, 0px 5px 0px 0px #600202, 0px 10px 5px #999;
-moz-box-shadow: inset 0px 1px 0px #600202, 0px 5px 0px 0px #600202, 0px 10px 5px #999;
-o-box-shadow: inset 0px 1px 0px #600202, 0px 5px 0px 0px #600202, 0px 10px 5px #999;
box-shadow: inset 0px 1px 0px #600202, 0px 5px 0px 0px #600202, 0px 10px 5px #999;
}
a.demo_b_d:active {
top:3px;
background-image: linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -o-linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -moz-linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -ms-linear-gradient(bottom, rgb(188,0,0) 0%, rgb(84,0,0) 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, rgb(147,0,0)),
color-stop(1, rgb(188,0,0))
);
-webkit-box-shadow: inset 0px 1px 0px #600202, 0px 2px 0px 0px #600202, 0px 5px 3px #999;
-moz-box-shadow: inset 0px 1px 0px #600202, 0px 2px 0px 0px #600202, 0px 5px 3px #999;
-o-box-shadow: inset 0px 1px 0px #600202, 0px 2px 0px 0px #600202, 0px 5px 3px #999;
box-shadow: inset 0px 1px 0px #600202, 0px 2px 0px 0px #600202, 0px 5px 3px #999;
}
a.demo_b_d::before {
background-color:#fff;
background-image:url(https://2.bp.blogspot.com/-Gtt5NvpPcgw/XOmJdLcH-MI/AAAAAAAAAB4/fZlc6LbhdhA-JmmLsT6yzaBAjnG4E0cYQCLcBGAs/s1600/netflix.png);
background-repeat:no-repeat;
background-position:center center;
content:"";
width:20px;
height:20px;
position:absolute;
right:15px;
top:50%;
margin-top:-9px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
-webkit-box-shadow: inset 0px 1px 0px #600202, 0px 1px 0px #600202;
-moz-box-shadow: inset 0px 1px 0px #600202, 0px 1px 0px #600202;
-o-box-shadow: inset 0px 1px 0px #600202, 0px 1px 0px #600202;
box-shadow: inset 0px 1px 0px #600202, 0px 1px 0px #600202;
}
a.demo_b_d:active::before {
top:50%;
margin-top:-12px;
-webkit-box-shadow: inset 0px 1px 0px #60c9f0, 0px 3px 0px #600202, 0px 6px 3px #600202;
-moz-box-shadow: inset 0px 1px 0px #60c9f0, 0px 3px 0px #600202, 0px 6px 3px #600202;
-o-box-shadow: inset 0px 1px 0px #60c9f0, 0px 3px 0px #600202, 0px 6px 3px #600202;
box-shadow: inset 0px 1px 0px #60c9f0, 0px 3px 0px #600202, 0px 6px 3px #600202;
}Y el del post es este:
HTML:
<center><div class="divspoiler">
<a class="demo_b_d" href="https://www.youtube.com/channel/UC4UBA4wLRTAUKCVC_zOY1EQ?sub_confirmation=1" target="_blank" onclick="if (this.parentNode.nextSibling.childNodes[0].style.display != '') { this.parentNode.nextSibling.childNodes[0].style.display = ''; } else { this.parentNode.nextSibling.childNodes[0].style.display = 'none';}" >Mostrar Cuentas Premium ▼▲</a>
</div><div><div class="spoiler" style="display: none;"><br />
Aqui las cuentas@gmail.com<br />
Aqui las cuentas@gmail.com<br />
O en enlaces o lo que sea.<br />
</div></div></center>No sé si eso sea posible, y gracias. 🙂
Última edición:
