PDA

View Full Version : [DHTML] Javascript crosshair (custom) mouse cursor



justas
09-28-2006, 07:55 PM
1) CODE TITLE:
Javascript crosshair (custom) mouse cursor

2) AUTHOR NAME/NOTES:
Justas Vinevicius

3) DESCRIPTION:
This script will add a fancy custom crosshair mouse cursor to your website.

4) URL TO CODE:
http://www.webtoolkit.info/javascript/crosshair-custom-mouse-cursor/index.html

QuakeMaster
09-28-2006, 08:01 PM
Very nice script there m8. I was looking for something like this for a long time now.. It will go nicely with my Quake'like website :D
Thanks!

Twey
09-28-2006, 08:07 PM
With the advent of cursor:url() in FX, I don't particularly see the point in this.

justas
09-28-2006, 08:12 PM
With the advent of cursor:url() in FX, I don't particularly see the point in this.

Well cursor:url() doesn't work in Opera, and in Mozilla its only 1.8+ :( . So i thought maybe someone will like this solution. And i see that QuakeMaster did - thanks m8. ;)

blm126
09-28-2006, 08:58 PM
It appears as if there are two cursors and one is a couple seconds behind(Opera 9). Personally I would just use CSS and if a browser didn't support it to bad for you.

mburt
09-29-2006, 12:16 AM
Great overall, but it kind of "flickers" in FF. A nice script though all the same :)

ddadmin
10-02-2006, 02:50 AM
It's a nice effect. I think the problem with most custom cursors though (using DHTML, not CSS for example) is the unnecessary scrollbars they create when you move the mouse to scroll the page. It's quite unattractive to the user when that happens.

justas
10-02-2006, 05:00 PM
It's a nice effect. I think the problem with most custom cursors though (using DHTML, not CSS for example) is the unnecessary scrollbars they create when you move the mouse to scroll the page. It's quite unattractive to the user when that happens.

I think it could be solved.. Its not so hard. Ill try to implement this feature :)

justas
10-02-2006, 05:47 PM
It's a nice effect. I think the problem with most custom cursors though (using DHTML, not CSS for example) is the unnecessary scrollbars they create when you move the mouse to scroll the page. It's quite unattractive to the user when that happens.

Well i updated the script now it doesnt generate horizontal or vertical scrollbars, in IE, FF and OP. ;)
P.S. i also included some aditional colored cursors. :cool:

ddadmin
10-02-2006, 08:16 PM
Actually I still get the h/v scrollbar, in Firefox anyway in on this demo page (http://demo.webtoolkit.info/javascript/effects/crosshair-cursor/index.html). The only way is probably to detect when the mouse is too close to the edges of the window based on the cursor's dimensions, and hide the cursor in that case.

djr33
10-03-2006, 05:56 AM
Yeah, the appearence of the scrollbars just made the effect a bit less fun.
Also, if you go off the screen, the "cursor" just stays there, while your mouse is somewhere in another window.
Seemed realistic until I noticed that.

justas
10-03-2006, 07:33 AM
Actually I still get the h/v scrollbar, in Firefox anyway in on this demo page (http://demo.webtoolkit.info/javascript/effects/crosshair-cursor/index.html). The only way is probably to detect when the mouse is too close to the edges of the window based on the cursor's dimensions, and hide the cursor in that case.

S**t i forgot to update script in demo page :mad: ..
I only did it here http://www.webtoolkit.info/javascript/effects/crosshair-mouse-cursor/source/index.html

Now its ok. Sorry ppl :rolleyes:

djr33
10-03-2006, 08:51 AM
Ah. So that's updated?
Update the demo :)

justas
10-03-2006, 12:02 PM
Ah. So that's updated?
Update the demo :)

I already did ;)

ddadmin
10-03-2006, 06:27 PM
Can this script be made content sensative, so the custom cursor only replaces the default cursor, and not the cursor for important indicators like links (hand cursor)?

justas
10-04-2006, 05:53 PM
Can this script be made content sensative, so the custom cursor only replaces the default cursor, and not the cursor for important indicators like links (hand cursor)?

Well, i'll try to do so.

justas
10-04-2006, 06:33 PM
You gave me a very good idea, so ill rewrite this script. And if i'm right it'll be very flexible and content sensitive. And very skinable like winamp LOL :D

ddadmin
10-05-2006, 01:03 AM
Cool. Looking forward to seeing the new version.

justas
10-08-2006, 07:31 PM
Hi everyone, i updated the script. Now you can create skins very easy, just modify the skin file. I made an animated crosshair :).

Updated script: http://www.webtoolkit.info/javascript/effects/crosshair-mouse-cursor/index.html

Demo is on the demo page. Have fun. :cool:

blm126
10-08-2006, 08:33 PM
Wow, impressive!

justas
10-29-2006, 01:09 PM
Updates:

- Performance improvements
- Some bugs where corrected

ddadmin
10-30-2006, 04:49 AM
The script is definitely ready for primetime now I'd say. :) Script just featured on DD: http://www.dynamicdrive.com/dynamicindex13/customcursor2.htm

justas
10-30-2006, 07:25 AM
The script is definitely ready for primetime now I'd say. :) Script just featured on DD: http://www.dynamicdrive.com/dynamicindex13/customcursor2.htm

Nice :) . I hope people will find this script usefull.

QuakeMaster
11-18-2006, 09:55 AM
I have a question. How can i make this cursor bigger?
Is it possible ? :confused:

djr33
11-18-2006, 10:50 AM
yes, just change the image that you're using.

Questions about scripts should go in the "Dynamic Drives Script Help" section (the one that holds this one, up one level), not here. This is for SUBMITTING scripts.

justas
11-26-2006, 10:28 AM
I have a question. How can i make this cursor bigger?
Is it possible ? :confused:

Chane the image (skin), and change some variables (image size) in .js file.