[英]How change css property using jquery
I am simply showing triangle on top of a div as shown in this example: http://jsfiddle.net/yuvaraj_b/wPWDm/19/ . 我只是在div的顶部显示三角形,如以下示例所示: http : //jsfiddle.net/yuvaraj_b/wPWDm/19/ 。
I want a triangle for MENU FOUR
to show on right side rather than left. 我希望
MENU FOUR
显示的三角形显示在右侧而不是左侧。
This is not working: 这不起作用:
$(this).find(".dropdown ul li:first-child > a:after").css( "left", "300px" );
How can I fix this so that it detect this class and change the postion of left
. 我该如何解决这个问题,以便它检测到此类并更改
left
的位置。
Psuedo-elements such as :after
do not exist in the DOM and therefore cannot be targeted by jQuery selector strings. 诸如
:after
类的伪元素在DOM中不存在,因此无法通过jQuery选择器字符串作为目标。
Usually you can accomplish the same thing by using CSS classes and the addClass
and removeClass
(or toggleClass
if you plan on switching it back later in the code execution) jQuery methods - this will allow you to dynamically change the CSS that creates the psuedo-element. 通常,您可以通过使用CSS类以及
addClass
和removeClass
(如果打算在以后的代码执行中再切换回去,则可以使用toggleClass
)jQuery方法来完成相同的事情-这将允许您动态更改创建psuedo-element的CSS 。 So, instead of directly manipulating the CSS of the psuedo element through jQuery, instead write a CSS class for your a
element that has the updated CSS for the a:after
psuedo element and toggle that class when the triangle needs to be moved. 因此,与其直接通过jQuery直接操作psuedo元素的CSS,不如为您
a
元素编写一个CSS类, a
元素具有a:after
psuedo元素的更新CSS,并在需要移动三角形时切换该类。
Add a class of the parent element instead, and assign static CSS styles based on that new class. 而是添加父元素的类,然后根据该新类分配静态CSS样式。
:after
cannot be targeted by JavaScript directly. :after
无法直接由JavaScript定位。
$(this).find(".dropdown ul li:first-child > a").addClass('moved');
CSS: CSS:
.dropdown ul li a.moved:after {
left: 300px;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.