How to use jQuery Visited Plug-In?
💻 coding

How to use jQuery Visited Plug-In?

1 min read 118 words
1 min read
ShareWhatsAppPost on X
  • 1The jQuery.visited.js plug-in hides visited links and displays them with a slide effect when the 'show all' button is clicked.
  • 2The implementation requires including jQuery and the visited plug-in scripts in the HTML document.
  • 3The provided JavaScript code manages the visibility of links and the refresh button using jQuery functions.

AI-generated summary · May not capture all nuances

Key Insight
AskGif

"The jQuery.visited.js plug-in hides visited links and displays them with a slide effect when the 'show all' button is clicked."

How to use jQuery Visited Plug-In?

Today am adding jQuery.visited.js plug-in. Visited links hide with jQuery when clicking on show all button it displays already visited links list in slide effect.

This Plugin is useful in displaying the links which are already visited by the users.

Javascript code

Contains jQuery code calling visited function.

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.visited.js"></script>
<script type="text/javascript" >
$(function ()
{
$('#links a').visited(function () {
$(this).parent().hide();
});

$('#show').click(function () {
$('#links a').visited(function () {
$(this).parent().slideDown(200);
});
$(this).fadeOut();
$("#refresh").fadeIn();
return false;
});
});
</script>

HTML Code.

Here refresh button style="display:none"

<div id="links">
<ul class="block">
<li&gt;<a href="link-1">Title 1.</a></li>
<li><a href="link-2">Title 2.</a></li>
<li><a href="link-3">Title 3.</a></li>
.
.
.
</ul>
</div>

<a href="#" id="show">Show all visited link</a>
<a href="#" style="display:none" id="refresh"> Refresh </a>

Enjoyed this article?

Share it with someone who'd find it useful.

ShareWhatsAppPost on X

AskGif

Published on 25 September 2019 · 1 min read · 118 words

Part of AskGif Blog · coding

You might also like