Heim > Artikel > Web-Frontend > Beispiel eines von jQuery_jquery implementierten Text-Hover-Farbverlaufseffekts

Beispiel eines von jQuery_jquery implementierten Text-Hover-Farbverlaufseffekts

WBOYOriginal: 2016-05-16 15:14:471722Durchsuche

Das Beispiel in diesem Artikel beschreibt den von jQuery implementierten Text-Hover-Farbverlaufseffekt. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

<html>
<head>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
 $("a").hover(function(){
 $("a").animate({width:"80%",height:"40%",fontSize:"100px"},1600,function(){
 $("a").animate({color:"#FFFFFF"},1600);
 });
 },function(){
 $("a").animate({color:"blue"},1600,function(){
 $("a").animate({width:"100px",height:"20px",fontSize:"14px"},1600);
 });
 });
});
</script>
</head>
<body>
<a href="#" style="width:100px;height:20px;font-size:14px;border:red 1px solid;">我不是淡入淡出</a>
</body>
</html>

Leser, die an weiteren jQuery-bezogenen Inhalten interessiert sind, können sich die Spezialthemen auf dieser Website ansehen: „Zusammenfassung der Drag-Effekte und Techniken von JQuery“, „Zusammenfassung allgemeiner klassischer Spezialeffekte von jQuery“, „ Zusammenfassung der jQuery-Erweiterungsfähigkeiten“, „Zusammenfassung der Verwendung des JQuery-Selektors“ und „Zusammenfassung der allgemeinen JQuery-Bedienungskompetenzen“

Ich hoffe, dass dieser Artikel allen in der jQuery-Programmierung hilfreich sein wird.

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Beispielcode für das ECharts-Dashboard (mit Quellcode-Download)_Javascript-KenntnisseNächster Artikel：Beispielcode für das ECharts-Dashboard (mit Quellcode-Download)_Javascript-Kenntnisse

In Verbindung stehende Artikel

Mehr sehen