Remove 'Dotted' lines around links when clicked

In this section you can share self-made extensions with other users of WYSIWYG Web Builder.
There is a dedicated section for commercial extensions.
Post Reply
User avatar
me.prosenjeet
 
 
Posts: 1265
Joined: Mon Dec 24, 2007 1:50 pm
Location: Lucknow
Contact:

Remove 'Dotted' lines around links when clicked

Post by me.prosenjeet »

Remove 'Dotted' lines around links when clicked Thanks to Bacon Fries
Image

This is to get rid of dotted lines that comeup around a link on a webpage when the link is clicked. As you see in the image what I am referring to.
Simply drag this extension on your page/master page. No configuration

Details and Download
http://lucknowwebs.com/get-rid-of-dotte ... n-clicked/
Check the new Chat GPT and Malware detect extensions at the link below

Check my WB Extensions
Check my WB Templates
---------------------------------------------------------
www.Lucknowwebs.com
User avatar
pedro-pecker
 
 
Posts: 38
Joined: Thu Feb 26, 2009 2:22 pm
Location: Devon UK

Re: Remove 'Dotted' lines around links when clicked

Post by pedro-pecker »

Works a treat pop it on the masterpage & job done!
thanks me.prosenjeet
Regards
Pedro
User avatar
zinc
 
 
Posts: 2146
Joined: Sat Dec 08, 2007 3:06 pm
Location: London, United Kingdom
Contact:

Re: Remove 'Dotted' lines around links when clicked

Post by zinc »

I can its usefulness, however for tab-index you may need the focus if you are going through a form for example.
Running WYSIWYG Web Builder since 2007...
User avatar
BaconFries
 
 
Posts: 5324
Joined: Thu Aug 16, 2007 7:32 pm

Re: Remove 'Dotted' lines around links when clicked

Post by BaconFries »

@ me if that is the case as bendigo has mentioned then we can do this

Code: Select all

<style type="text/css">
a:focus
{
  -moz-outline: none 0;
  outline: none 0;
}
</style>
Also if usinfg a form and the push button gives the same we need to add onfocus="this.blur(); to the button as shown below

<input type="submit" onfocus="this.blur();" />
User avatar
me.prosenjeet
 
 
Posts: 1265
Joined: Mon Dec 24, 2007 1:50 pm
Location: Lucknow
Contact:

Re: Remove 'Dotted' lines around links when clicked

Post by me.prosenjeet »

Hi Bacon,
Little confused....
Should I use this:
<style type="text/css">
a
{
-moz-outline: none 0;
outline: none 0;
}
</style>
Or
This:
<style type="text/css">
a:focus
{
-moz-outline: none 0;
outline: none 0;
}
</style>
in the general extension (without form)

Further, looking into your code
Also if usinfg a form and the push button gives the same we need to add onfocus="this.blur(); to the button as shown below

<input type="submit" onfocus="this.blur();" />
Do you suggest I add this in the extension as--
Using form: Yes/ No (Yes will remove // and apply the below code. This way works in php but I am not sure here-though a page with a form will always be in php! :? )
//<input type="submit" onfocus="this.blur();" />
Or this should be added manually if someone is using a form?
Check the new Chat GPT and Malware detect extensions at the link below

Check my WB Extensions
Check my WB Templates
---------------------------------------------------------
www.Lucknowwebs.com
User avatar
BaconFries
 
 
Posts: 5324
Joined: Thu Aug 16, 2007 7:32 pm

Re: Remove 'Dotted' lines around links when clicked

Post by BaconFries »

<input type="submit" onfocus="this.blur();" />
No this doesnt need to be added I only gave this as a example for use with form buttons :)

The amended code with focus was as bedigo mentioned regarding the same issue that may appear if using tabs, I have tested both and they work the same...there is another method for using form buttons but this only works for gecko browsers such as firefox as it doesnt work in IE it not worth adding to the code.
User avatar
me.prosenjeet
 
 
Posts: 1265
Joined: Mon Dec 24, 2007 1:50 pm
Location: Lucknow
Contact:

Re: Remove 'Dotted' lines around links when clicked

Post by me.prosenjeet »

Ok, so the current extension requires no change and I will leave it the way it is it?
Check the new Chat GPT and Malware detect extensions at the link below

Check my WB Extensions
Check my WB Templates
---------------------------------------------------------
www.Lucknowwebs.com
User avatar
BaconFries
 
 
Posts: 5324
Joined: Thu Aug 16, 2007 7:32 pm

Re: Remove 'Dotted' lines around links when clicked

Post by BaconFries »

Yer it works as it is
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: Remove 'Dotted' lines around links when clicked

Post by jordan »

TNX for the update mail, index al up to date now, very nice me.prosenjeet . 8) .
WWBman
 
 
Posts: 916
Joined: Fri Jan 08, 2010 6:10 pm

Re: Remove 'Dotted' lines around links when clicked

Post by WWBman »

This doesn't work for me! What am I doing wrong?
http://wwb.atwebpages.com
User avatar
me.prosenjeet
 
 
Posts: 1265
Joined: Mon Dec 24, 2007 1:50 pm
Location: Lucknow
Contact:

Re: Remove 'Dotted' lines around links when clicked

Post by me.prosenjeet »

WWBman wrote:This doesn't work for me! What am I doing wrong?
http://wwb.atwebpages.com
your link worked for me on IE8
Check the new Chat GPT and Malware detect extensions at the link below

Check my WB Extensions
Check my WB Templates
---------------------------------------------------------
www.Lucknowwebs.com
WWBman
 
 
Posts: 916
Joined: Fri Jan 08, 2010 6:10 pm

Re: Remove 'Dotted' lines around links when clicked

Post by WWBman »

This is weird.
I normally use Maxthon Classic browser and the extension doesn't work.
I tried IE8, Chrome, Firefox, Slimbrowser and Avant and they all worked!!
I'll have a look at my Maxthon settings to see if there is anything there although it uses the Trident engine (same as IE) so I doubt if I'll find anything.
User avatar
BaconFries
 
 
Posts: 5324
Joined: Thu Aug 16, 2007 7:32 pm

Re: Remove 'Dotted' lines around links when clicked

Post by BaconFries »

I could be wrong here but it is because Maxthon doesnt support CSS2 styling fully only partially and requires a seperate plugin to do so...you could take a look at the Maxthon forum and find out more regarding this....
You can try this, it is untested for Maxthon as I dont use it and as I have mentioned it does not fully support CSS2 styling so it simply may not work due to this...Note this has nothing to do with WB but with how Maxthon works sorry....

Code: Select all

<style type="text/css">
a:focus 
{
outline: 0;
}
</style>
Or try this:

Code: Select all

<script type="text/javascript">
for(i=0;i<=document.links.length-1;i++) {document.links.[i]hideFocus='true'}
</script>
WWBman
 
 
Posts: 916
Joined: Fri Jan 08, 2010 6:10 pm

Re: Remove 'Dotted' lines around links when clicked

Post by WWBman »

Thanks BaconFries, I tried both without success.
BUT I repeated the original code on my other PC which runs IE7 and only Firefox and Chrome work.
So it looks like it's a Trident engine issue that IE7 uses and Maxthon Classic issue with IE8's Trident engine.
It's no big deal, thanks anyway.
User avatar
Patrik iden
 
 
Posts: 479
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Remove 'Dotted' lines around links when clicked

Post by Patrik iden »

Hi, and Thank's. This works for me. But not on Submit or Reset buttons in Contact form, can that be done?
User avatar
BaconFries
 
 
Posts: 5324
Joined: Thu Aug 16, 2007 7:32 pm

Re: Remove 'Dotted' lines around links when clicked

Post by BaconFries »

The code is only for images...I did give a solution to me for buttons in forms but you need to add this manually by adding to the Button HTML inside tag*

Code: Select all

onfocus="this.blur();" 
focus.gif
User avatar
Patrik iden
 
 
Posts: 479
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Remove 'Dotted' lines around links when clicked

Post by Patrik iden »

OK, Do i ptu this code in the Contact page or in masterpage. I dont know but i tryed bouth and it dont work for me, in IE8
User avatar
Patrik iden
 
 
Posts: 479
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Remove 'Dotted' lines around links when clicked

Post by Patrik iden »

aah, i'v got iy in the the button code of course :oops:
User avatar
BaconFries
 
 
Posts: 5324
Joined: Thu Aug 16, 2007 7:32 pm

Re: Remove 'Dotted' lines around links when clicked

Post by BaconFries »

You do not place it on the page it needs to be inserted into the button itself like below in image
butfocus.gif
User avatar
Patrik iden
 
 
Posts: 479
Joined: Wed Mar 24, 2010 9:07 pm
Location: Sweden

Re: Remove 'Dotted' lines around links when clicked

Post by Patrik iden »

Got it Thank you.
Post Reply