Enhance Opera's mouse cursor over text
Saturday, 3. March 2007, 21:32:43
Ever wish Opera's mouse cursor behaved like Firefox's or MSIE's in web pages? You know, when you hover over text in a web page, the cursor actually changes to a meaningful text caret, rather than remaining a stupid old default NW mouse cursor.
Usability experts say that text carets (vertical mouse cursor) should be used as a visual feedback mechanism when underlying text can be selected. Plus, text carets do not obscure underlying text, like the default NW mouse cursor does. Personally, this is just one Opera pet peeve solved with User JavaScript.
So, with my latest UserJS script (shown below), now you too can have this 'smart' mouse cursor feature in Opera!
Keep in mind, this script is currently non-optimized for extremely large pages, or pages with poorly written HTML markup and/or scripts. Regardless, it does seem to work pretty well on most sites.
Download/view the textNodes.js script
I'll keep this blog entry updated to reflect the most recent version of the script, so stay tuned.
Known issue:
BTW, feedback is always appreciated.
Enjoy.
Usability experts say that text carets (vertical mouse cursor) should be used as a visual feedback mechanism when underlying text can be selected. Plus, text carets do not obscure underlying text, like the default NW mouse cursor does. Personally, this is just one Opera pet peeve solved with User JavaScript.
So, with my latest UserJS script (shown below), now you too can have this 'smart' mouse cursor feature in Opera!
Keep in mind, this script is currently non-optimized for extremely large pages, or pages with poorly written HTML markup and/or scripts. Regardless, it does seem to work pretty well on most sites.
Download/view the textNodes.js script
document.addEventListener("load",
function() {
var body = document.getElementsByTagName("BODY");
if (!body) return;
var isIgnored = function(node) {
var bad = /^(SCRIPT)|(STYLE)|(OPTION)|(TEXTAREA)|(INPUT)|(\#cdata\-section)|(\#comment)$/i;
var result = false;
while (node && !result) {
result = (node.nodeName.match(bad) ||
((node.nodeName == "A") && node.href));
node = node.parentNode;
}
return result;
}
var nodeIterator = document.createNodeIterator(
body[0],
NodeFilter.SHOW_TEXT,
{ acceptNode : function (node) {
return (/\S+/.test(node.data) && !isIgnored(node)) ?
NodeFilter.FILTER_ACCEPT:
NodeFilter.FILTER_REJECT;
}
},
true
);
var a = new Array();
var textNode;
while ((textNode = nodeIterator.nextNode())) {
if (!textNode.parentNode.style) continue;
if (textNode.parentNode.style.cursor != "") continue;
if (textNode.parentNode.currentStyle.cursor != "default") continue;
a.push(textNode);
}
if (!a.length) return;
var ss = false;
var sheet = null;
for (var i = 0; i < document.styleSheets.length; i++) {
sheet = document.styleSheets[i];
ss = (!sheet.media || !sheet.media.length);
if (ss) break;
for (var j = 0, m; m = sheet.media[j]; j++) {
ss = (m.match(/^(\*)|(all)|(screen)$/i));
if (ss) break;
}
}
if (ss) sheet.insertRule(
"SPAN.crsrTxt { \
font: inherit !important; \
color: inherit !important; \
background: none !important; \
padding: 0 0 0 0 !important; \
margin: 0 0 0 0 !important; \
clear: none !important; \
z-index: inherit !important; \
float: none !important; \
display: inline !important; \
cursor: text !important; }", 0);
while ((textNode = a.pop())) {
var span = document.createElement("span");
if (ss) span.className = "crsrTxt";
else {
span.style.color = "inherit";
span.style.background = "none";
span.style.padding = "0 0 0 0";
span.style.margin = "0 0 0 0";
span.style.clear = "none";
span.style.zIndex = "inherit";
span.style.float = "none";
span.style.display = "inline";
span.style.cursor = "text";
}
textNode.parentNode.insertBefore(span, textNode);
span.appendChild(textNode);
}
}, 0);
I'll keep this blog entry updated to reflect the most recent version of the script, so stay tuned.
Known issue:
- Script may not work on poorly coded HTML and JavaScript websites (foxnews.com)
- There's a known crash bug in Opera 9.20 when using this script on newegg.com
BTW, feedback is always appreciated.
Enjoy.

