Enhance Opera's mouse cursor over text
Saturday, March 3, 2007 9:32:43 PM
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 HTTP 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:
Updated: 6/3/2010 - This squeaky wheel finally found some grease. Fixed for Opera 10.53!
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 HTTP sites.
Download/view the textNodes.js script
window.addEventListener("load",
function(event) {
var body = document.getElementsByTagName("BODY");
if (!body) return;
if (body.length) body = body[0];
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,
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;
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
- By default, UserJS scripts do not run on HTTPS/SSL pages, unless changed by users
Updated: 6/3/2010 - This squeaky wheel finally found some grease. Fixed for Opera 10.53!
BTW, feedback is always appreciated.
Enjoy.

Øyvind ØstlundNoteMe # Sunday, March 4, 2007 1:01:55 AM
Cheers,
- ØØ -
David Cowelldavidcowell # Thursday, April 5, 2007 6:52:24 AM
Lee HarveyLee_Harvey # Wednesday, April 11, 2007 1:15:31 PM
-- exploit does? Just curious before I start using it.
No.
This UserJS script simply uses the default text/caret cursor as specified by the user/OS. The .ani cursor exploit requires an infected .ani file to be downloaded and previewed on an unpatched Windows system.
To obtain the Windows patch, simply visit Windows Updates with IE:
http://windowsupdate.microsoft.com
Chojiro # Thursday, January 31, 2008 11:32:37 PM
Edit: Oops, just realised this is old. Oh well.
dapxin # Tuesday, March 3, 2009 6:27:02 AM
Lee HarveyLee_Harvey # Tuesday, March 3, 2009 12:48:15 PM
Save the script to a folder, then specify that folder (not filename) at Preferences > Advanced > Content > JavaScript Options... > User JavaScript files
You can effectively disable this script by using site-specific preferences, and declaring a different User JavaScript files folder location. If you encounter issues on a site, right-click on the page, select "Edit Site Preferences...", goto the "Scripting" tab, and change the "User JavaScript files" folder location.
As mentioned in the "Known Issues" above, the script may not work on poorly-coded HTML and JavaScript websites. Also, if the content already specifies a cursor for its display, then this script does not override the author's original intent.
And for large, complex web pages, there may be a slight performance hit of 1-4 seconds after the page has loaded.
My original intent for this script was simply to provide a proof-of-concept for Opera; to display cursors more like IE and Mozilla browsers.
In general, this script is not intended to change the look-and-feel of the author's original underlying content, only the mouse cursor.
dapxin # Tuesday, March 3, 2009 6:04:12 PM
I hope they implement it in O10.
Lee HarveyLee_Harvey # Wednesday, March 4, 2009 12:09:15 AM
mdajobs # Tuesday, November 17, 2009 5:33:03 AM
Thank you and that's a nice little routine you wrote. How did you ever figure that out?
While I followed your instructions, its not working for me. I know I followed them right because I tried to change the folder name after setting the preferences, just in case the space in the folder name was causing the problem, and Windows complained that it was being used.
precisely how does Opera know how to reach your event handler in textNotes.js?
;-))
Lee HarveyLee_Harvey # Wednesday, December 23, 2009 1:59:49 PM
I figured it out by reading-over Opera's UserJS Tutorial (over-and-over again): http://www.opera.com/browser/tutorials/userjs/using/
Also, the tutorials at UserJS.org also helped: http://userjs.org/help/tutorials/
In fact, UserJS.org has a nice article describing how to install UserJS scripts, if you are still having problems: http://userjs.org/help/installation
In general, Opera simply loads all *.js files from the folder specified by:
opera:config#UserPrefs|UserJavaScriptFile
...or Preferences> Advanced tab> Content section> JavaScript Options... button> User JavaScript folder.
To disable a UserJS script, simply rename the file extension (from .JS) to something other than .JS
Hope this helps
dapxin # Saturday, April 10, 2010 8:41:03 PM
Lee HarveyLee_Harvey # Saturday, April 10, 2010 9:04:44 PM
dapxin # Saturday, April 10, 2010 9:27:25 PM
Evgenylopotun # Sunday, May 16, 2010 1:03:05 PM
And since you made me addicted to it
Thanks!
Lee HarveyLee_Harvey # Friday, June 4, 2010 3:10:36 AM
Enjoy.
dapxin # Friday, June 4, 2010 12:57:19 PM
kslee # Wednesday, June 9, 2010 7:38:52 PM
I've been waiting sooooo
Works fine on 10.60.
dapxin # Tuesday, May 3, 2011 4:14:18 AM
Lee HarveyLee_Harvey # Tuesday, May 3, 2011 12:15:52 PM
Dependencies:
- Page must load successfully (no errors preventing JS execution)
- Page must contain at least one <script> block to load UserJS
- Page must contain at least one <body> block to enumerate
- Page must contain at least one <style> block to insert CSS rule