本文介绍了通过 jQuery/Javascript 添加悬停 CSS 属性的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着跟版网的小编来一起学习吧！
问题描述
Some CSS styles need to be applied to an element on hover, and CSS styles have to be applied using javascript/jquery directly and not through stylesheets or $(this).addClass('someStyle') because I am injecting the DOM elements into another page.
We can apply the usual css styles using
$('#some-content').css({
marginTop: '60px',
display: 'inline-block'
});
How should we add the CSS styles for :hover events?
Do we have to resort to:
$('#some-content').hover(
function(){ $(this).css('display', 'block') },
function(){ $(this).css('display', 'none') }
)
解决方案
I find using mouseenter and mouseleave to be better than hover. There's more control.
$("#somecontent").mouseenter(function() {
$(this).css("background", "#F00").css("border-radius", "3px");
}).mouseleave(function() {
$(this).css("background", "00F").css("border-radius", "0px");
});
这篇关于通过 jQuery/Javascript 添加悬停 CSS 属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！