Espero que alguien pueda ayudarme con un problema que tengo. Estoy tratando de cambiar el color de fondo de mi página cuando paso el mouse sobre un enlace de navegación en la página. He intentado usar jquery para esto (últimas líneas de mi código js) pero parece que no funciona. Creo que algunos de mis otros Js están interfiriendo de alguna manera porque antes funcionaba en una página de prueba simple. https://codepen.io/adamkelly153/pen/gOGaJYq
$('#hover-01').on('mouseenter', function() { $('#hover-change').css('background-color', 'blue'); }); $('#hover-01').on('mouseleave', function() { $('#hover-change').css('background-color', 'red'); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="hover-01">Hover this!</div> <div id="hover-change">Background changes</div>Cualquier ayuda muy apreciada! Lo siento si me he perdido alguna información clave, feliz de proporcionarla. Adán
¡Cambié #hover-01 a .proj-cat y funcionó!
$('.proj-cat').on('mouseenter', function(){ $('#hover-change').css('background-color', 'blue'); }); $('.proj-cat').on('mouseleave', function(){ $('#hover-change').css('background-color', 'red'); });Mantenga siempre su cdn por encima de su jquery porque jquery solo funciona cuando se ha cargado cdn.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"> $('#hover-01').on('mouseenter', function() { $('#hover-change').css('background-color', 'blue'); }); $('#hover-01').on('mouseleave', function() { $('#hover-change').css('background-color', 'red'); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="hover-01">Hover this!</div> <div id="hover-change">Background changes</div>