StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POHow do I remove focus onmousedown in IE?
primarykey
Id
2205653
data
AcceptedAnswerId
2211149
AnswerCount
7
ClosedDate
CommentCount
3
CommunityOwnedDate
CreationDate
2010-02-05T07:38:09.803
FavoriteCount
2
LastActivityDate
2010-03-06T07:23:30.653
LastEditDate
2010-03-06T07:23:30.653
LastEditorUserId
205405
OwnerUserId
205405
ParentId
0
PostTypeId
1
Score
11
ViewCount
4862
LastEditorDisplayName
text
Body
The ultimate goal: pretty pages for mouse users, accessible pages for keyboard users. The effect I want is for clicking an anchor to produce no outline during and leave no outline after. Further, I want keyboard tabbing to move the focus and thus surround items with an outline. The following code works in FF (and I assume the other modern browsers, but I will have to test them tomorrow at the office), but not IE6-8. The problem lies in the fact that onmousedown doesn't seem to blur as expected: <pre><code>var links = document.getElementsByTagName('a'); for (var i=0; i < links.length; i++) { links[i].onmousedown = function () { this.blur(); return false; } links[i].onclick = function() { this.blur(); } } </code></pre> One compromise would be if any one has a solution that can handle the case in IE where the user mouses down, mouses off the anchor, then mouses up, and leaves no outline behind would be a step in the right direction. Thanks. EDIT: Friday, March 5th, 2010 My deepest apologies for taking so long to get back to this, but I needed a solution that worked in as many browsers as possible. Well, it turns out no timeouts are needed only some outline, class, and focus management. The following solution works in IE6+, FF2+, Safari 3+, and Chrome. I have not tested in Opera, but would love if someone could confirm/deny that it works. What follows is more suedo-code than pure js. I leave it as an exercise for the reader to implement in your favorite framework: <pre><code>var anchorEventIsMouse = true; $('a').mousedown(function() { anchorEventIsMouse = true; this.hideFocus = true; /* IE6-7 */ this.style.outlineStyle = 'none'; /* FF2+, IE8 */ this.addClass('NoOutline'); /* see click func */ this.setFocus(); /* Safari 3+ */ }); $('a').keydown(function() { anchorEventIsMouse = false; }); $('a').blur(function() { this.style.outlineStyle = ''; this.hideFocus = false; this.removeClass('NoOutline'); }); $('a').click(function(e) { /* Adding class NoOutline means we only allow keyboard * clicks (enter/space) when there is an outline */ if (!anchorEventIsMouse && this.hasClass('NoOutline')) { e.stopEventPropagation(); } }); </code></pre>
Tags
<javascript><html><css><internet-explorer>
Title
How do I remove focus onmousedown in IE?
singulars
PostAcceptedAnswerId
1. PO
 singulars
 PostTypePostTypeId
 PTAnswer
PostParentId
1. This table or related slice is empty.
PostTypePostTypeId
1. PTQuestion
UserLastEditorUserId
1. USBrett Pontarelli
UserOwnerUserId
1. USBrett Pontarelli
plurals
PostLinksPostIdRelatedPostId
1. PL
 singulars
 LinkTypeLinkTypeId
 LTLinked
PostLinksRelatedPostIdPostId
1. This table or related slice is empty.
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. PO
 singulars
 PostTypePostTypeId
 PTAnswer
2. PO
 singulars
 PostTypePostTypeId
 PTAnswer
3. PO
 singulars
 PostTypePostTypeId
 PTAnswer
VotesPostIdCreationDate
1. VO
 singulars
 PostPostId
 POHow do I remove focus onmousedown in IE?
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTUpMod
2. VO
 singulars
 PostPostId
 POHow do I remove focus onmousedown in IE?
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTUpMod
3. VO
 singulars
 PostPostId
 POHow do I remove focus onmousedown in IE?
 UserUserId
 USЯegDwight
 VoteTypeVoteTypeId
 VTFavorite
CommentsPostId

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.