Jquery Link Scrubber Hack for Blogger

07. Aug, 2008 18 Comments


Everyone would have noticed in their Blogs that whenever you click an Link a dotted border appear around the link. The dotted Border not only appears for links but for all images , Post Titles , etc. It’s some what Annoying . After surfing internet for a while Now I have found a hack developed by Crismancich , which removes the dotted line onfocus from links.

JqueryLinkScrubberHack Jquery Link Scrubber Hack for Blogger

What things We need ?

To Implement this Link Scrubber Hack we need to scripts namely ,

1. Jquery 1.2.2 .js

2. Link Scrubber Script

How to implement this Link Scrubber Blogger Hack ?

Go to Layout section of your Blog Template and then navigate to Edit HTML sub tab.

Now search for this code </head> and place the following code immediately above that line.

<script type=”text/javascript” src=”http://jqueryjs.googlecode.com/files/jquery-1.2.1.pack.js”></script>

<script type=”text/javascript” src=”http://www.crismancich.de/jquery/plugins/linkscrubber/jquery.linkscrubber.js”></script>

or

<script type=”text/javascript” src=”http://jqueryjs.googlecode.com/files/jquery-1.2.1.pack.js”></script>

<script> $(document).ready(function(){$(“a”).bind(“focus”,function(){if(this.blur)this.blur();});}); </script>

That’s it We have successfully added Jquery Link Scrubber Hack for Blogger.

Alternative Method

We can also remove the dotted lines using simple CSS code.

just add this css code to your Template above </head>

<style>*{outline:none}</style>

If you Have any doubt please ask me , I am here to help you .

See you soon with a new hack.

Mohamed Rias - has written 94 posts on Techie Blogger

I am Mohamed Rias , admin of Techieblogger.com. Basically I am Engineering student but still blogging is my passion. My areas of interest are HTML , CSS , Jquery , Javascript and PHP.

Visit Authors Website  |  All Articles From This Author
0
hits

If you like this article , then please help us by bookmarking

18 Responses to “Jquery Link Scrubber Hack for Blogger”

  1. Wolverine Reply 15. Aug, 2008 at 10:48 pm

    there is one more trick to overcome this problem..

    just add the following code between <head> and </head>

    a {outline: none;}
    a img {border:0px;outline: none;}

  2. Mohamed Rias Reply 16. Aug, 2008 at 2:41 am

    Hi Wolverine ,

    Yes we can achieve that using that simple CSS.
    Thanks for mentioning that CSS.

    regards,
    Blogger Accessories

  3. Mishef Reply 25. Aug, 2008 at 8:48 am

    Thanks! Its very helpful..

  4. ¢r!$†!ãn Omg!! ... Reply 18. Nov, 2008 at 10:32 pm

    a

  5. Shafar Reply 21. Jan, 2009 at 9:42 am

    Wow I think you have great knowledge about Jquery.. Really nice man..
    Tips Blogger

  6. fyzue Reply 16. Feb, 2009 at 2:00 am

    nice trick, i put it on my blog right now.
    Say no to dotted line… :)

  7. Emb Reply 03. Mar, 2009 at 11:52 am

    And this…???
    a {outline: none}

  8. Aravind D Reddy Reply 23. May, 2009 at 4:38 am

    This too is nice.

  9. ZK@Web Marketing Blog Reply 20. Jun, 2009 at 8:54 pm

    It is built on top of the DOM, and unfortunately, the DOM is not always fun to work with. Luckily, we have an excellent DOM slicer and dicer that we can use alongside Strophe, the jQuery library.

  10. BaxyStanteele Reply 14. Jul, 2009 at 11:32 am

    Billiards, pool
    Croatia Service

  11. popurls.com // popular today

    popurls.com // popular today…

    story has entered the popular today section on popurls.com…

  12. Dariusz Siedlecki Reply 15. Jul, 2009 at 10:00 am

    This is a great technique, but remember that it’s really bad to use it for users who’re controlling their browsers via keyboard, or other alternative methods. With a keyboard, you can just tab to the link you want, and hit Enter to go there. When you remove the outline, you have no idea which link are you at, therefore really making it harder for your users.

  13. Brian Jørgensen Reply 15. Jul, 2009 at 10:46 am

    I totally agree with Dariusz Siedlecki, but I must admit, I’m used to remove the dotted outline myself.

    But it can be a bad thing in some cases, that’s true.

  14. Chris Cassell Reply 15. Jul, 2009 at 12:01 pm

    So basically, this prevents anyone from using the keyboard to navigate you site, since as soon as one attempts to put focus on a link by tabbing to it, the focus is immediately removed. Don’t use the javascript, use the css if you must.

  15. Anders Ekdahl Reply 15. Jul, 2009 at 12:26 pm

    Not only is it harder for people who use the keyboard to navigate, but if you automatically blur the element on focus, people who only use the keyboard can’t navigate at all, because no links can be focused on.

  16. t4-trix Reply 03. Sep, 2009 at 10:16 am

    hi rias ,i would like to publish two of your tricks on my blog
    1.that u used earlier for ur navigation
    2.in ur side bar when i click tabs ,it slides automatically how

  17. whey.protein.side.effects Reply 21. Dec, 2009 at 6:44 am

    Very extraordinary site.
    The information here is really helpful.

    I will tell my friends.

    Cheers

  18. DeveloperNetowrk Reply 31. Dec, 2009 at 10:03 am

    Wow it was quite helpful this post.
    Would it be possible to use for submit inputs?
    …Although i have found a way to by pass this im using html and js of which i have to place as an attribute each time i create a input submit element!

Blogger Hack