Cómo agregar un efecto de transición a las imágenes en mi sitio web de contenido adulto

yoclens · 26 Sep 2016

hola amigos de la comunidad de foro beta tengo una web de contenido adulto la cual ya esta lista, pero quisiera agregar este efecto de transición anexo una web para que vena el efecto que quiero lograr, me explico deben pasar el mouse sobre la imagen y ver el efecto que causa, se que es con imágenes pero no se que mas me hace falta si es un script o algo por el estilo gracias de ante mano.

Free Porn Sex Videos - Redtube - XXX Movies - Home of Videos Porno

perdonen si incurro en una norma publicando este link pero soy nuevo en el foro y creo que es una forma de dar a conocer mi problema que quiero resolver...

Knightdragon · 27 Sep 2016

El efecto que mencionas es una característica que de algunos themes, la mayoría para video o sitios tube xxx, pero tienes que compar la plantilla, ya que no creo que encuentres algún plugin que adapte esa caraterística a cualquier plantilla, precisamente por eso es que los desarrolladores de estos themes los vendes para sitios xxx, aca te dejo un enlace de una plantilla con que contiene dicha característica. https://adult-wordpress-theme.com/

De otra manera tendrías que contratar a un programador para te haga ese trabajo.

Marketing Doing · 5 Dic 2016

Bueno amigo lo que quieres hacer es una script para que cambie la imagen:

Código HTML:

HTML:

<ul id="galeria">
<li><img src="/blog/../img/rascafria-1.jpg" border="0" alt="Rascafría" /></li>
<li><img src="/blog/../img/rascafria-2.jpg" border="0" alt="Rascafría" /></li>
<li><img src="/blog/../img/rascafria-3.jpg" border="0" alt="Rascafría" /></li>
</ul>

CSS:

HTML:

<style>
/** galeria **/
#galeria{display: block; margin: 0 0 0 15em; padding: 0; position: relative; width: 50%;height: 22.5em; list-style: none; border: 10px solid #1a1a1a; border-radius: 10px; box-shadow: 0 0 10px #000; overflow: hidden;}
#galeria li{position: absolute; top: 0; left: 0; width: 100%;border-radius: 10px;background-color:#1a1a1a;paddiing: .4em;}
#galeria li img{width: 100%;border-radius: 10px;background: #1a1a1a;}
#galeria .selected{z-index: 1; opacity: 1; -moz-transition: all 2s ease 0s;-ms-transition: all 2s ease 0s;-o-transition: all 2s ease 0s;-webkit-transition: all 2s ease 0s;transition: all 2s ease 0s;}
#galeria .noselected{z-index: 0; opacity: 0; -moz-transition: all 2s ease 0s;-ms-transition: all 2s ease 0s;-o-transition: all 2s ease 0s;-webkit-transition: all 2s ease 0s;transition: all 2s ease 0s;}
</style>

y el JavaScript:

HTML:

<script>
/** javascript slide-show **/
var cons = 1;
function slide_show(){
var elemento = document.getElementById('galeria').getElementsByTagName('li');	
for(var n=cons; n <= elemento.length; n++){		
 elemento[n].className = 'selected';
 for(var i = 0; i<elemento.length; i++){
  if(i!=cons){
   elemento[i].className = 'noselected';
  }		
 }
  cons++;							
  break;
 }	
 if(cons >= elemento.length){
  cons = 0;		
 }
 return false;
}
window.onload = function(){
 setInterval(slide_show, 5000);
}
</script>

Ahora solo te queda modificar cada uno de los parámetros para que te funcione

Cómo agregar un efecto de transición a las imágenes en mi sitio web de contenido adulto

yoclens

Knightdragon

Marketing Doing

Temas similares