[英]Working with JQuery to change CSS properties
I am using the Jquery UI tabs, and want to change the properties of an element on mouseover. 我正在使用Jquery UI选项卡,并想在鼠标悬停时更改元素的属性。
My HTML is this: 我的HTML是这样的:
<ul id="sub-tabs"> <li><a href="#000"><span>000<br /><p id="ct1">General</p></span></a></li> </ul>...
And jquery is: jQuery是:
$('#guide-nav ul#sub-tabs span').mouseover(function() {
$("#guide-nav ul#sub-tabs li p").css("display", "none");
});
But this is not working. 但这是行不通的。
<ul id="sub-tabs">
<li><a href="#000"><span>000<br /><p id="ct1">General</p></span></a></li>
</ul>
Jquery is: jQuery是:
$('#guide-nav ul#sub-tabs span').mouseover(function() {
$("#guide-nav ul#sub-tabs li a span p").css("display", "none");
});
Or try this: 或尝试以下方法:
$('#guide-nav ul#sub-tabs span').mouseover(function() {
$("p#ct1").css("display", "none");
});
Or this: 或这个:
$('#guide-nav ul#sub-tabs span').mouseover(function() {
$(this).find('p').css("display", "none");
});
Use this 用这个
$('#guide-nav ul#sub-tabs span').mouseover(function() {
$("#guide-nav ul#sub-tabs li p").css({display:"none"});
});
Okay, i wrapped this in a function and it works... 好吧,我将其包装在一个函数中,并且可以工作...
$(function() {
$('#guide-nav ul#sub-tabs li a span').mouseover(function() {
$(this).find('p').css("display", "none");
});
});
I decided to use the above statement to only hide the elements within the selected tab, because there will be multiples 我决定使用上面的语句仅隐藏所选选项卡中的元素,因为会有多个
When I try your code it actually works. 当我尝试您的代码时,它实际上可以工作。 Are you sure that the DOM has finished loading when you are executing the javascript?
您确定执行JavaScript时DOM已完成加载吗?
$(document).ready(function() {
$('#guide-nav ul#sub-tabs span').mouseover(function() {
("#guide-nav ul#sub-tabs li p").css("display", "none");
});
});
Instead of .css("display", "none");
代替
.css("display", "none");
you can also use .hide()
您也可以使用
.hide()
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.