Submit Hint Search The Forums LinksStatsPollsHeadlinesRSS
14,000 hints and counting!

Change Safari cursor shape based on link target Web Browsers
As people adjust to Safari 3, I wanted to share a little addition that's helped me work more quickly: a cursor change depending upon a link's target. If the link will open as is in a new tab, the cursor doesn't change. If it will open in a new window, however, the cursor will change to a crosshair.

Open ~/Library » Application Support » Safari » userContent.css and add the following, then save:
/* Change cursor for links that open in new window */
:link[target="_blank"],
:visited[target="_blank"],
:link[target="_new"],
:visited[target="_new"] {
cursor: crosshair; }
[robg adds: This works for Safari 2 as well -- just create a file named mystyle.css (or whatever you like, ending in .css) somewhere on your hard drive, then visit the Advanced tab in Safari's Preferences, click the Style Sheet pop-up menu, and point it to the .css file you just created. It should also work for any other browser that supports the cursor property and custom style sheets.]
    •    
  • Currently 3.33 / 5
  You rated: 5 / 5 (3 votes cast)
 
[15,713 views]  

Change Safari cursor shape based on link target | 30 comments | Create New Account
Click here to return to the 'Change Safari cursor shape based on link target' hint
The following comments are owned by whoever posted them. This site is not responsible for what they say.
Change Safari cursor shape based on link target
Authored by: RussellK on Jun 21, '07 08:28:38AM

Maybe I'm missing something...or maybe my Mac's missing something(!), but I don't have a Safari folder in any of my Application Support folders. I'm using Safari 3 on 10.4.10.

Rob, in your comment about the hint, you don't describe how to go about making this .css file. Do you mean a .css file containing the text from the original hint? How does one create a new .css file?



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: RussellK on Jun 21, '07 08:31:06AM

...as a quick update...I searched for a file called usercontent.css and came up with a few results all found in my Navigator or Mozilla folders within the Application Support folder.



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: RussellK on Jun 21, '07 08:36:44AM

...so I copied the usercontent.css file from my /Application Support/Navigator folder onto my Desktop, then opened that file in GoLive and pasted in the text from the original hint (removing all the other text in there). Then I pointed Safari to the new .css file per Rob's instructions, and nothing has changed in Safari. I visited some sites that I know have links targeted to open in new windows...and just the same old Mickey Mouse hand cursor appears when hovering...



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: ghay on Jun 21, '07 09:09:46AM

a CSS file is just a text file.

Did you even try the method suggested by the editor?

I think if you are struggling this hint could be beyond your capabilities.



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: RussellK on Jun 21, '07 11:12:20AM

Thanks ghay. Your criticism is in sharp contrast to the usual helpfulness promoted on this site.

I'm "struggling" with the hint because it describes a folder that doesn't exist on my Mac.

Did you even READ my post before replying to it?

Now that we have some more insightful commentary about how to create the folder AND the .css file, I'll give it another try and see if I can grasp the complexities of this hint.




[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: ghay on Jun 22, '07 07:12:52AM

Create a file and a folder, complexities!!

To all people struggling with not finding a folder, I will encourage you once again to read....

robg adds: This works for Safari 2 as well -- just create a file named mystyle.css (or whatever you like, ending in .css) somewhere on your hard drive, then visit the Advanced tab in Safari's Preferences, click the Style Sheet pop-up menu, and point it to the .css file you just created. It should also work for any other browser that supports the cursor property and custom style sheets.



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: RussellK on Jun 22, '07 10:47:02AM

Ghay,

First of all, the instructions to "just create a file named mystyle.css (or whatever you like, ending in .css)" are not the best example of clear instructions for a site devoted to sharing "hints" among visitors. I'm sure there are a number of issues which could be explained so bluntly and still evade your understanding if you didn't already know some subtlety of the subject (e.g., that a .css file is just a text file with a .css extension). I apologize if my ignorance somehow makes you feel offended.

Secondly, there seem to be plenty of other people having trouble getting this to work. Your attitude that not being able to figure this out is reflective of serious incompetency that renders people not worthy of being a part of the macosxhints community is narrow-minded and unwelcome.




[ Reply to This | # ]
Complexities..
Authored by: alexmathew on Jun 22, '07 12:33:43PM

I hope you are not a teacher, parent or ever get involved in instructing anyone!
You automatically assume that if someone cannot get it to work, they must be dumb????
Can you figure out the structural rigidity of a space launch vehicle nozzle required to place a 1500kg satellite into orbit - I just happen to do it for a living... I bet you could - just by creating a folder and a file!
AM



[ Reply to This | # ]
Complexities..
Authored by: ghay on Jun 25, '07 12:38:28AM

First of all, you are insulting the editor-in-chief of the hints site by saying

" just create a file named mystyle.css (or whatever you like, ending in .css) " is not clear enough for a hints site.

And as for Mr. Space Shuttle, anyone who can't read simple instructions is dumb, or illiterate. No prejudice against illiterate people, I reckon there are dome fairly smart illiterates who have had a hard time in life, but for the rest of us, as I suggested if you can't create a simple text file and point safari at it via the preferences dialog, and then criticise the editor for his step-by-step instructions not being clear enough, you are a dumbass, as you so clearly pointed out . . . "It's not rocket science"



[ Reply to This | # ]
Complexities..
Authored by: RussellK on Jun 26, '07 11:12:02AM

Okay okay...I don't think this is the appropriate forum for such exchanges, so I'll concede that I'm simply a dumbass (along with everyone else who didn't instantly get this hint to work on their systems). I mean...it could be worse...I could make a thoughtless typo within a rant about illiterate people...but I digress.

I doubt very much that Rob was offended by my posts...but let it be known that I did not enter into this thread for the mere purposes of offending or insulting anyone. That would just be "unconstructive."



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: osxfan57 on Jun 21, '07 09:43:33AM

I also don't have a Safari folder in any of my Application Support folders and I'm using Safari 3 on 10.4.10 as well. It's not a question of technical competence in implementing the hint if the first step describes a folder that doesn't exist.

---
G5 2.5GHz 1.5Gb RAM, OS 10.4.8



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: osxfan57 on Jun 21, '07 09:53:41AM

So I created a Safari subfolder in the ~/Library/Application Support folder. Then I created a text file with the contents as described here. Then I saved it in that new Safari folder as userContent.css. Then quit Safari. Restarted. No changes to cursor whether link opens in new window, new tab or same window. Suggestions? Thanks.

---
G5 2.5GHz 1.5Gb RAM, OS 10.4.8



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: broomdodger on Jun 21, '07 10:06:13AM
/* Change cursor for links that open in new window */
Note the KEY words "links that open in new window".
If the link does NOT specify open a NEW window, the cursor will NOT change. Not many links specify open in new window.
I you have the menu View > Status Bar on (it is at the bottom of the Safari window), you can see if the link specifies opening a NEW window.
It is working for me with Safari Version 2.0.4

[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: osxfan57 on Jun 21, '07 07:43:00PM

The links I tried did in fact specify (and do) open in a new window. Still doesn't work. Big deal - life goes on.

---
G5 2.5GHz 1.5Gb RAM, OS 10.4.8



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: LeeH on Jun 21, '07 10:17:43AM

I did all the things you did PLUS the last step of going to Safari Preferences>Advanced and then clicked on the Style Sheet drop down menu and selected Other. Then I navigated to the .css file created and selected it.

Did not even have to restart Safari. Started working right away.



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: statistics on Jun 21, '07 09:48:00AM

Fantastic hint, thank you. I've always found links that open in new windows to be very annoying.



[ Reply to This | # ]
Another...
Authored by: Sebhelyesfarku on Jun 21, '07 10:35:34AM

To differentiate Javascript links from normal html links for e.g. with a question mark:

a[href^="javascript:"], a[onclick] {
cursor: help;
}



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: Roquentin on Jun 21, '07 10:53:26AM

Nice hint. There are lots of cursor styles available, though (google "CSS and cursor"), and in this context I would suggest "cursor: ne-resize" instead.



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: jvr on Jun 21, '07 11:35:01AM

Yes, very nice hint. That will save me from having to glance at the status bar every time I want to know how a link is directed.

I went with the "ne-resize" suggestion (an arrow pointing up and to the right), since that makes sense to me, visually representing "leaving this window." I also applied Sebhelyesfarku's suggestion for javascript links, and since most of those result in pop-up windows, I used the "n-resize" cursor style (an up arrow).



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: mbroughtn on Jun 21, '07 05:19:42PM
You might want to check out what may be available for cursor styles by seeing what is defined in the w3c.org CSS rules. <http://www.w3.org/TR/CSS21/ui.html#cursor-props>;

[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: RussellK on Jun 21, '07 11:34:44AM

Now I've tried everything suggested, and still no dice.

I've created a text file, pasted in the author's text, saved as a .css file, created a /Safari folder in my /Application Support folder and placed my .css file in that folder then pointed to the file in Safari's preference pane.

Can anyone suggest a good example on the web where such "open in new window" links are found?



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: RussellK on Jun 21, '07 11:47:37AM

Okay...now I see that this works on SOME links targeted to open in new windows, but not ALL such links (i.e., I'm guessing the pages I was testing have css already dictating the cursor styles for their links to new windows.

This makes the hint's functionality too subjective and unreliable for me. But it's a great idea...



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: Roquentin on Jun 21, '07 12:09:50PM
There are two links ("Aperture" at the top; "Web site" at the bottom) on this page: www.macworld.com/2007/02/reviews/aperture152/index.php.

In my experience, it doesn't matter where the css file is located; only that it's selected in Safari's preferences. Here's the sum total of my css file, from start to finish:

/* Change RSS feed pages to reduce title size and wrap titles */
body[onClick="articleClicked(null)"][onLoad="setup(null)"] .content .articlehead .subject {
    white-space: normal !important;
    font-size: 85% !important;
    letter-spacing: 0.03em !important;
}

/* Remove link underlining and adjust link color */
a:hover { color: #990000 !important; }
a:active { color: #00CCFF !important; }
a { text-decoration:none !important; }

/* Change cursor for links that open in new window */
:link[target="_blank"],
:visited[target="_blank"],
:link[target="_new"],
:visited[target="_new"] {
cursor: ne-resize; }


[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: osxfan57 on Jun 21, '07 07:44:54PM
www.digg.com - every story heading link is a new window link

---
G5 2.5GHz 1.5Gb RAM, OS 10.4.8

[ Reply to This | # ]

Change Safari cursor shape based on link target
Authored by: mark hunte on Jun 21, '07 02:33:50PM
Nice hint. I think I am going to use the progress cursor (which i only just discovered safari had)
It's really and nice in colour, plus less confusing (for me at least) than the Crosshair
/* Change cursor for links that open in new window */
:link[target="_blank"],
:visited[target="_blank"],
:link[target="_new"],
:visited[target="_new"] {
cursor: progress; } 

---
mh

[ Reply to This | # ]

Folder does not exist and creating one with a file does not work.
Authored by: alexmathew on Jun 21, '07 04:54:32PM

Ok as another reported, I do not have a Safari folder in Application Support. I tried creating the folder and the Users/username/Library/Application Support/Safari/userContent.css file but the hint does not work. I also selected the .css file in Safari preferences.

So this works for some.

Safari 3.0, 10.4.10, PPC PB G4 1.5



[ Reply to This | # ]
Does not work.. from me.
Authored by: alexmathew on Jun 21, '07 04:56:05PM

As noted in other comment. No Safari folder, creating one and the file also does not help.
AM



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: kanny on Jun 21, '07 07:13:47PM

I am able to get the crosshair for new-page-links, but am unable to get the other styles like 'progress' or 'ne-resize' . Any idea ?



[ Reply to This | # ]
Change Safari cursor shape based on link target
Authored by: chymb on Jun 22, '07 06:47:32PM

Won't this only apply for links that are not opening in a named window? Or does Safari 3.0 open named windows in tabs?
i.e. <a ... target='MyNewWindow'>Link</a>

Is this perhaps causing the confusion?



[ Reply to This | # ]
Thanks
Authored by: mergatroid on Jul 08, '07 04:29:25PM

This is one cool feature.



[ Reply to This | # ]