Sun, 2008-08-31 13:52
Hi,
I'm modifying the http://foliage-in-xml.blogspot.com/# foliage wordpress theme here:
http://shokka.net/forty-three/
Can anyone see why my custom cursor won't display?
* { margin: 0; padding: 0; outline: none;} h1, h2, h3, p, pre, blockquote, form, fieldset, ul, ol { margin: 1em 0; } body {font: 62.5% verdana, arial, sans-serif; color: #ddd; background: #00010a; text-align: center; cursor: url(images/cursor.cur);} a:link, a:active, a:visited {color: #efb;} a:hover { color: #d0dda3; } a { text-decoration: none; } h1, h2, h3, h4 { text-transform: lowercase; color: #efb; } h1 { font-size: 2em; } h2 { font-size: 1.7em; } h3 { font-size: 1.5em; } h4 { font-size: 1.3em; } .chrondate { color: #3f3f3f; padding-left: 0.5em; } .chrondate a { color: #3f3f3f; } .chrondate a:hover { color: #d0dda3; } #shelfwrap { background:url(images/master_header_01.jpg) no-repeat 50% 100% ;} #shelf { color: #d6ddbc; text-align: left; width: 58em; min-height: 208px; margin: 0 auto; line-height: 1.5em; } #shelf .left { width: 28em; padding: 0 0.5em 0.5em; } ul#navigation { margin: 0; padding: 0 0 1em 0; list-style: none; } #navigation li { background: url() repeat-x 0.7em 0; } #navigation li a { float: left; padding: 0 0.2em 0 0; } ul#navigation li span { float: right; padding: 0 0.2em; } ul#navigation li br { clear: both; } #shelf .right { width: 27em; padding: 0 0.5em 0.5em; } ul#recentposts {list-style: none; } #recentposts li { background: url(images/li.gif) no-repeat 0 0.3em; padding-left: 15px; margin-left: 4px; } #shelfbreak { background: #656C4A; height: 0em; } #searchbar { background: url(images/searchbg.jpg) no-repeat top left; display: block; height: 41px; width: 270px; margin: 0 0 0 -0.2em; padding: 0.2em 0 0 1em;} #searchform div { padding: 0.2em 0 0 0; } #searchform span { margin-left: 3.6em; } #search { width: 140px; border: 1px solid #333; background: #333; font-size: 1em; font-family: verdana, arial, sans-serif; color: #eee; } /* top banner */ #banner { background: #00010a no-repeat top left; height: 15em; } #foliage { margin: 0 auto; background: url(images/master_header_02.jpg) no-repeat top left; display: block; width: 784px; height: 148px; } #pull a { float: right; display: block; width: 300px; height: 146px; text-indent: -9999em; background: url(images/stars.swf) no-repeat top right; } #pull a:hover { background: url(images/stars.swf) no-repeat bottom right; } /* -------------------------------------------- content */ #top {background: #00010a; } #content { width: 51em; margin: 0 auto 0; padding: 0 0 6em 0; text-align: left; line-height: 1.5em; } .post { padding: 0 0 1.5em 0; } .entrymeta { margin: -1em 0 2em 0; text-transform: lowercase; } .entry img { padding: 3px; background: #444; border: 1px solid #444; } .entry ul li, .mulch ul li { list-style: none; background: url(images/li.gif) no-repeat 0 0.3em; padding-left: 1.5em; margin-left: 2.2em; } .entry ol, .mulch ol { margin-left: 3.5em; } .entry li, .mulch li { padding-bottom: 0.3em; width: 423px; font-size: 1em; } .entry blockquote, .mulch blockquote { margin-left: 3.9em; color: #8f8f8f; width: 423px; } .entry strong, .mulch strong { color: #efb; } .returnhome { float: right; } /* -------------------------------------------- content details */ .commentnote { color: #B3BE82; padding: 0.5em 0.3em 0 0.9em; } #singlecontent { width: 75em; margin: 0 auto; padding-bottom: 3em; text-align: left; line-height: 1.5em; } #singlecontent .post { float: left; width: 45em; } #commentscolumn { color: #d6ddbc; margin: 2em 0 3em 0; float: right; width: 28em; background: #656C4A url(images/snippet_right.gif) no-repeat bottom right; } .comments {color: #d6ddbc; margin: 0; padding: 9px 9px 0 9px; background: url(images/snippet_left.gif) no-repeat -1px -1px;} #commentwrap { float: left; margin:0; padding-bottom: 3em; } #commentform small {color: #555;} .commentlist li { list-style: none; border-top: 1px solid #717a50; padding-top: 0.3em; } .author .commententry { background: url(images/author.gif) no-repeat top right;} .commententry { padding: 0 0.8em 0 0.9em; overflow: hidden; } .commententry blockquote {color: #B3BE82; margin-left: 1em;} #author, #email, #url, #comment {font: 11px verdana, arial, sans-serif; background: #333; border: 1px solid #555; color: #ddd; padding: 2px; } #author, #email, #url {width: 185px;} #comment {width: 436px; height: 125px; overflow: auto; font-size: 10px;} #submit {background: #656C4A; border: 1px solid #d6ddbc; color: #d6ddbc; font-size: 11px; padding: 0 1em;} /* -------------------------------------------- footer content */ #footer { color: #d6ddbc; width: 58em; margin: 1em auto 0; padding: 0 0 30px 0; text-transform: lowercase; } /* -------------------------------------------- misc */ .clear {clear: both;} .center {text-align: center;} /* ----------------------------------- floats */ .right { float: right; } .left { float: left; } .clear { clear: both; } .fix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .fix { display: inline-block; } * html .fix { height: 1%; } .fix { display: block; }
Mon, 2008-09-01 06:10
#1
Your cursor is a 2 layer
Your cursor is a 2 layer psd. You need to flatten and save as. Try the attached .cur image. Rename, dropping the gif extension.
cheers,
gary
| Attachment | Size |
|---|---|
| cursor-real.cur_.gif | 3.46 KB |
Mon, 2008-09-01 06:36
#2
You were absolutely right.
You were absolutely right. Well done ! 
EDIT: sorrrry, no. Didn't make any difference. I even created one with a cursor creator and it made no difference whatsover.
Thanks
Mon, 2008-09-01 07:18
#3
resolved
I used the exact link to my cursor, http blah, as it didn't know where to find it
Mon, 2008-09-01 14:49
#4
Firefox2: didn't work and
Firefox2: didn't work and didn't honor fallback value (crosshair)
Firefox3: worked a charm using both .cur and .ico formats
Opera: didn't work and didn't honor fallback value
IE 6&7: worked with .ico, but not .cur
Maybe it's an idea that's not quite ready for prime time.
cheers,
gary
Mon, 2008-09-01 19:44
#5
And hopefully it will never
And hopefully it will never be ready for prime time! This is one of those things that oughtn't to be played with. The standard set of icons for hover, move, text etc are fine and dandy and generally recognisable.
Tue, 2008-09-02 01:00
#6
To second Hugo, if I find a
To second Hugo, if I find a site messing around with my cursors that's one good reason to leave and not return. I know how the cursors work in my OS and browser, now you want to make me guess? Bye bye...
Wed, 2008-09-03 07:18
#7
yes I find it quite tacky.
yes I find it quite tacky. However, in the case as I was solving a navigation issue to help my users, I disagree. Also, if you look at a lot of the flash sites today, eg, FWA award winning ones, if it's done right, it can help point users in the right direction and look cool at the same time. I did get it working (thanks guys) but decided not to use it in the end.
Thanks for your opinions anyway!!
Wed, 2009-05-13 00:51
#8
Cursor wont show
Not sure if this is still an issue for you,
a H1 - H6 cannot have a cursor assigned
you can with a div.
Here is some CSS
WONT WORK
.parent .yadda h3.show_you { background:transparent url(../images/headlines/show_you.gif;) no-repeat; CURSOR: pointer; text-indent:-9999px;}
WILL WORK
.parent .yadda .show_you { background:transparent url(../images/headlines/show_you.gif;) no-repeat; CURSOR: pointer; text-indent:-9999px;}
So for you headings you can set individual style in the div class.
Wed, 2009-05-13 03:41
#9
Hi, and welcome to the
Hi, and welcome to the forum.
But, what, exactly gave you that idea? The cursor property works on any visible element; that includes h1-6.
cheers,
gary