jQuery: Blink text using jQuery

Last update on July 22 2025 12:39:25 (UTC/GMT +8 hours)

jQuery Practical exercise Part - I : Exercise-6

Blink text using jQuery.

Sample Data :

<body>
<p>jQuery <span class="blink">Exercises</span> and Solution</p>
</body>

Sample solution :

HTML Code :

<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
  <meta charset="utf-8">
  <title>Blink text using jQuery</title>
</head>
<body>
  <p>jQuery <span class="blink">Exercises</span> and Solution</p>
</body>
</html>

JavaScript Code :


function blink_text() {
    $('.blink').fadeOut(500);
    $('.blink').fadeIn(500);
}
setInterval(blink_text, 1000);

Go to:

jQuery Practical Exercises Home ↩
jQuery Exercises Home ↩

PREV : Fix broken images automatically.
NEXT : Create a Zebra Stripes table effect.

See the Pen jquery-practical-exercise-6 by w3resource (@w3resource) on CodePen.

Contribute your code and comments through Disqus.