cufon styling
- Started
- Last post
- 22 Responses
- Moo0
Thanks shitehawke will have a look in to these now and maybe tomorrow night i might be able to get my head around it or by then maybe i will have given up lol thanks again
- No worries, it was actually pretty simple to implement once I'd figured out what was wrong.shitehawke
- shitehawke0
Theres also this jquery plugin: http://allinthehead.com/retro/33…
and this one: http://labs.unitinteractive.com/…
These refused to work for me but as I said, thats probably down to not getting my head around the urls required.
- shitehawke0
hahaha, yeah I got it working fine. I used this chap here: http://www.twinhelix.com/css/iep…
After looking at a few others this was what I eventually got working, however I reckon that was due to my url bumbling.
If you do use that one, when chaning this line of code in the .HTC file:
var blankImg = '/images/blank.gif';just be aware that the url is how it relates to the html page calling the file. I was putting this into a CMS and getting stupid results, because I was putting the wrong url in there. I had "pics/blank.gif" thinking that would work but when looking at how the rest of the images were getting rendered it should have been "/themes/theme-name/pics/blank.g...
This one line fucked up my head for about 2 hours.
- Moo0
im currently doing the same have you been able to fix that as well?? trying to get a png background image to work in ie6 but i've had no success with it
- shitehawke0
Urk! Well just stick with it chief, I just spent the morning trying to get several png-transparency fixes to work in IE only to realise I hadn't put the proper url into the replacement code. bastard!
- Moo0
hahaha im going mad now i have it working its changing all of the list menu and becuase the menu is generated from the database it a little hard to code seperate areas thanks for the help shitehawke
- shitehawke0
Yeah did a bit of reseach and it appears to need the framework (such as jquery or mootools etc) to get it to select div type content as opposed to formatting tags such as h1, p, etc.
Tried using just li, such as:
Cufon.replace('li', {hover: true, fontFamily: 'Avenir 45' });
and it seems to work fine, but when you reference such an item in a specific div it throws a wobbly in IE.
- Moo0
your example seems to be working now in ie7
- kult0
Works fine for me on Firefox in Vista.
- shitehawke0
Well that was a dilly of a pickle.
I put jquery in there too and wrapped the cufon call inside a doc ready function and it seems to display fine on IE 6/7/8 & FF3 on vista and FF3 and safari on OSX.
Maybe the cufon call just can't handle the reference of a div in there too or perhaps it needs another global div reference.
Same link, just updated. This any good moo?
- Moo0
just had a look in serfi and it seem to work but no in anything else
- Hue0
<h1>Some Text here which should be in Flama Bold in black</h2>
unmatched tag, anything to do with this?- yeah thats my sloppy 'slap something together' coding.shitehawke
- shitehawke0
Hmm, just checked it out too. Its workign fine for me, os x ff3. and IE8 on vista, but not FF or IE 6/7.
Well now thats a curious little bugger. What platform you on?
- XP/FF3 works, XP/IE8 works except underlineneverblink
- XP/Safari doesn't workneverblink
- testing it on IE6+ and ffoxMoo
- Moo0
just had a look and it doesn't seem to have worked on your example either
- shitehawke0
Moo, not sure why thats not working, heres a quick test I set up, have a goo at it and it might shed some light on your problem.
- Moo0
no still not working
- Moo0
css code
#leftMenu ul{
list-style: none;
}#leftMenu ul li{
background-image: url(../images/custom/left_tab_bk...
background-repeat: no-repeat;
background-position: left top;
padding: 16px 10px 0 22px;
margin: 0;
height: inherit;
text-decoration: none;
font-size: 19px;
color: #d2d2d2;
width: 192px;
}#leftMenu ul li a {
text-decoration: none;
margin-bottom: 21px;
color: #f4f4f4;
}Will give the new cufon code a go cheers shitehawke
- shitehawke0
Moo, did you have any joy getting it to work?
- shitehawke0
Hang on, try this:
Cufon.replace('#leftMenu ul li a', {hover: true, fontFamily: 'Avenir 45' });
- shitehawke0
Moo can I see your CSS?