jQuery设置点击选中样式,onmouseover和onmouseout事件
1、点击选中设置样式
1 //默认选中第一个 2 $('.navigation>a:first-child>div').addClass('category-selected'); 3 //选中样式切换 4 $('.navigation>a>div').click((e => { 5 $('.navigation a>div').removeClass('category-selected'); 6 $(e.target).addClass('category-selected'); 7 }));
2、onmouseover和onmouseout事件
- img标签
1 /** 2 * 鼠标悬浮 3 * @param id 4 * @param imgOver 5 */ 6 function setFootImgOver(id, imgOver) { 7 $("#footImgLogo" + id).attr('src', imgOver); 8 } 9 10 /** 11 * 鼠标移除 12 * @param id 13 * @param imgOut 14 */ 15 function setFootImgOut(id, imgOut) { 16 $("#footImgLogo" + id).attr('src', imgOut); 17 }
- backgroud-image标签
1 /** 2 * 悬浮 3 * @param id 4 * @param imgOver 5 */ 6 function proCategoryImgOver(id, imgOver) { 7 $("#proCategoryImg" + id).css({'background-image': 8 'url(' + imgOver + ')'}); 9 } 10 11 /** 12 * 移除 13 * @param id 14 * @param imgOut 15 */ 16 function proCategoryImgOut(id, imgOut) { 17 $("#proCategoryImg" + id).css({'background-image': 18 'url(' + imgOut + ')'}); 19 }