Estoy siguiendo el sitio que se muestra a continuación para crear pestañas en mi sitio Divi (en mi host local en este momento), pero estaba buscando ayuda para cambiar el comportamiento del código.
Me las arreglé para seguir el tutorial y esto funciona exactamente como se muestra en el sitio, pero me gustaría cambiar el comportamiento de pasar el mouse por hacer clic en los anuncios publicitarios (nombres), pero no estoy seguro de qué parte de jquery necesito cambiar.
El siguiente es el código jquery:
jQuery(function($){ $(document).ready(function(){ $('#testimonial-person-1').addClass('testimonial-active'); $('[id*="testimonial-person"]').hover(function() { var $selector = $(this).attr('id').replace('person', 'copy'); var $testimonial = $('#' + $selector); $('[id*="testimonial-copy"]').removeClass('show-testimonial'); $testimonial.addClass('show-testimonial'); $('[id*="testimonial-person"]').removeClass('testimonial-active'); $(this).addClass('testimonial-active'); }); }); });El código CSS:
.show-testimonial { visibility: visible !important; opacity: 1 !important; top: 0 !important; } .testimonial-active { transform: translateX(-10%); } [id*="testimonial-person"]{ -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease; transition: all 0.5s ease; cursor: context-menu; } [id*="testimonial-copy"] { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; position: absolute!important; top: -100px; bottom: auto; left: 0; right: auto; visibility: hidden; opacity: 0; }Agradecería, si alguien pudiera orientarme en cómo puedo hacer este cambio en mi sitio.
Gracias por adelantado.
Gracias a David por señalarlo.
He cambiado la siguiente línea:
$('[id*="persona-testimonial"]').hover(función() {
y esto hace lo que yo quería.
Muchas gracias.