If I set the cursor for a Label in a css-file as shown below it works as expected. The cursor is a "wait-cursor" if it is moved over the Label
Label.mylabel:hover {
cursor: wait;
}
As it is described in the RWT-Theming-Reference the following should also be possible
Label.mylabel:hover {
cursor: url( resources/cursor.gif );
}
But I can not see my cursor.
How can I set an own image for a cursor?
Turns out that there is a bug in RAP that prevents custom cursors from being rendered. I'll provided a fix that will likely be included in the 3.0.1 release.
Update: the fix is merged and will be available in 3.1 M1 and 3.0.1.
Try this
label.mylabel:hover {
cursor:url("resources/cursor.gif"), auto;
}
Make sure that your are providing correct url for image.
Related
Here is the hierarchy of my website.
I am trying to set paw.png as my custom cursor.
Here is my code for the custom cursor in main.css.
#body{
cursor: url('Images/paw.png'), auto;
}
I am not sure why it's not working and only the default cursor appears. It would be great if someone could help me fix this issue.
Thanks in advance!
If you intend to apply that cursor to your complete page, you should use the selector body, not #body (which is an id selector)
body{
cursor: url('Images/paw.png'), auto;
}
make sure the URL is right and that you're selecting the right element, also there are some limitations on the size of the image that you can use as a custom cursor.
In Firefox, for example, the limit is 128×128px (Firefox 3.6-3.6.6 on Windows limits this to 32x32px.) so, try to use a 32x32px image to be in the safe zone
for more information: MDN
Well assuming that you have an id="body" on the body tag, you also need to fix the url which should be relative to the .css file and not to the root.
#body{
cursor: url('../Images/paw.png'), auto;
}
I want to use a custom cursor icon for my web site (permanently).
How can I do it?
The cursor is downloaded as a simple .ico file.
I have tried the custom cursor command but it did not seem to work.
html, body {
cursor: url("cursor.ico"), default;
/* just change the cursor.ico path to your location */
}
https://davidwalsh.name/css-custom-cursor
You can do this with css.
html {
cursor: url('path/to/your.ico'), default;
}
For more information, check the MDN
best to use .cur file which is best fitted you can get it from real world cursor drawer and draw your own to embed it like this:
cursor: url('hand.cur'),default;
I'd need to make my area elements appear as pointer cursor to indicate that they are clickable. The flags on the map at the right, 'http://www.metlifecare.co.nz/bay-of-plenty-villages' should appear like they are links.
I'm pretty sure the method I've been using right now to show the <areas> as pointer cursors is working before. Somehow, now its not working anymore.
CSS I've been using:
area:hover, .hover {
cursor: pointer;
display: block;
}
Based on the example, http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_areamap , the area elements are working as a link. However, the flags on the site I'm currently working are not. They should appear the same also.
Am I missing something or any suggestion for alternative to make it work correctly?
Some tips and tricks here. Seems you're not alone, at least! :)
Setting a cursor [with CSS] on an image map area
This problem is resolved after spending couple of hours looking on the web for a fix.
All what I did was remove the cursor:default; applied to the ''. Voila! The cursor:pointer applied to map elements are now working.
i've created an image including a hotspot area in dreamweaver. Whenever the mouse hovers over the hotspot the cursor changes to the hand-symbol. However, I do not want to change the cursor, as it is essential that the hotspot is "hidden".
Hope anyone can help me.
:)
#element:hover { cursor: default; }
Set the css cursor property to default like so:
cursor:default;
More information here: http://www.w3schools.com/cssref/pr_class_cursor.asp
I'm trying to make a CSS code that changes the cursor to a picture file when the cursor is on a webpage. I've seen sites that give you a simple code to do it but they always have ads. Any codes you guys know that can do this?
Yes, simply apply the following css code to your body tag (assuming you want effect for whole page):
body {
cursor: url('URL to image');
}
Further information:
The image file must be 32x32 or smaller
Internet explorer only supports .cur files
CSS:
html{
cursor: url(URL of pictures)
}
Other Simples:
http://www.html1.freeiz.com/Your_cursor.htmlhttp://jsfiddle.net/wNKcU/5/http://jsfiddle.net/wNKcU/788/
create an HTML element with the cursor image you want and use javascript's onmousemove event to move the cursor.
window.onmousemove= function(e) {cursor.left=e.x;cursor.top=e.y;} //cursor is the HTML element