如何使用jQuery更改文本颜色?

时间:2022-06-11 20:13:36

When I hover a text with animation definitely I will use jQuery. Is there a code that will change the color, or size?

当我悬停一个带有动画的文本时,我肯定会使用jQuery。是否有代码可以改变颜色或大小?

3 个解决方案

#1


228  

Place the following in your jQuery mouseover event handler:

在jQuery mouseover事件处理程序中放置以下内容:

$(this).css('color', 'red');

To set both color and size at the same time:

同时设置颜色和尺寸:

$(this).css({ 'color': 'red', 'font-size': '150%' });

You can set any CSS attribute using the .css() jQuery function.

可以使用. CSS () jQuery函数设置任何CSS属性。

#2


5  

Or you may do the following

或者您可以执行以下操作

$(this).animate({color:'black'},1000);

But you need to download the color plugin from here.

但是你需要从这里下载颜色插件。

#3


3  

Nowadays, animating text color is included in the jQuery UI Effects Core. It's pretty small. You can make a custom download here: http://jqueryui.com/download - but you don't actually need anything but the effects core itself (not even the UI core), and it brings with it different easing functions as well.

现在,动画文本颜色包含在jQuery UI效果核心中。这是很小的。您可以在这里进行自定义下载:http://jqueryui.com/download -但是除了效果核心本身(甚至不是UI核心)之外,您实际上不需要任何东西,它还提供了不同的缓动功能。

#1


228  

Place the following in your jQuery mouseover event handler:

在jQuery mouseover事件处理程序中放置以下内容:

$(this).css('color', 'red');

To set both color and size at the same time:

同时设置颜色和尺寸:

$(this).css({ 'color': 'red', 'font-size': '150%' });

You can set any CSS attribute using the .css() jQuery function.

可以使用. CSS () jQuery函数设置任何CSS属性。

#2


5  

Or you may do the following

或者您可以执行以下操作

$(this).animate({color:'black'},1000);

But you need to download the color plugin from here.

但是你需要从这里下载颜色插件。

#3


3  

Nowadays, animating text color is included in the jQuery UI Effects Core. It's pretty small. You can make a custom download here: http://jqueryui.com/download - but you don't actually need anything but the effects core itself (not even the UI core), and it brings with it different easing functions as well.

现在,动画文本颜色包含在jQuery UI效果核心中。这是很小的。您可以在这里进行自定义下载:http://jqueryui.com/download -但是除了效果核心本身(甚至不是UI核心)之外,您实际上不需要任何东西,它还提供了不同的缓动功能。