9lessons programming blog
Loading Search
Friday, June 5, 2009

Using jQuery Visited Plug-In.

My old post Visited links with CSS. today 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. Just take a look at live demo.




Download Script     Live Demo


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>

More Tutorials : Take a look at this link
Sponsored Links

Share this post

Comments
{ 2 comments }
Anonymous said...

oh cool, a plugin that limits usability!

Beben said...

we can do a:visited too on CSS kode...
nice trick

Post a Comment

Subscribe now!Recent Posts

Categories

Subscribe now!Popular Posts

People Says

@9lessons thank you for the great tutorials, we truly appreciate your contributions to the design community.

Smashing Magazine

Like Me

follow me
products

9lessons labs

9lessons clouds

Android application

Chrome Extension