javascript tag references for Cufon font replacement

[bexvlad]

I have managed to get Cufon working in factor-li.nl for the Javascript menu bar and selected tags. However, I am unable to find the correct reference to change the caption script on the Home page image scroller (editorial module).

I have added a rel link in the header.tpl to the editorial css:

<link rel="stylesheet" type="text/css" media="screen" href="http://www.factor-li.nl/modules/editorial/prod.css" />

and have quoted the js file it uses:

[removed][removed]

and this is the latest attempt to specify the bit I want replaced by Cufon (the #home_slideshow bit)

[removed]Cufon.replace(".sf-menu a", { hover: true })('h4')('h3')('#home_slideshow > #slide_navigation > a'); [removed]

This is the css file:

/*GENERIC GLOBAL STYLES*/
#home_slideshow p{padding-bottom:1em;}
#home_slideshow a{text-decoration:none; color:#cd2903;}
#home_slideshow a:hover{text-decoration:underline;}
.text_replace{background-repeat:no-repeat; outline:0; text-indent:-9999px;}
a.text_replace:active{outline:0;}
#home_slideshow{ position:relative; width:900px; height:300px; margin-top:2em; overflow:hidden; text-transform:none; font-size:16px; line-height:22px;}
#home_slideshow #home_slideshow_violator{z-index:1000; background-color:#365F91; width:510px; height:31px; float:right; position:relative; top:-50px; left:-20px;}
#home_slideshow #home_slideshow_violator #project_caption{display:none; padding:4px 10px; color:#ffffff; float:left;}
#home_slideshow #home_slideshow_violator #project_caption a{margin-left:8px;}
#home_slideshow #home_slideshow_violator #slide_navigation{position:absolute;right:10px;top:10px;}
#home_slideshow #home_slideshow_violator #slide_navigation a{ text-indent:-9999px; overflow:hidden; display:block; background-color:#4C3C15; width:14px; height:11px; float:left; margin-left:5px; cursor:pointer; overflow:hidden;}
#home_slideshow #home_slideshow_violator #slide_navigation a:hover{ background-color:#886B25;}
#home_slideshow #home_slideshow_violator #slide_navigation a.activeSlide{ background-color:#FBC747;}
#home_slideshow #home_slideshow_violator #slide_navigation a{outline:none;}
#home_slideshow li span.slide_caption{display:none;}
#home_slides{background-color:#333333; overflow:hidden; height:400px;}


/*HACKS*/
.clearfix:after {content:"."; display:block; height:0;clear:both; visibility:hidden;}
.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */

Can anyone help, please? I think others will find Cufon really helpful for personalising sites!

[bexvlad]

having problems posting the middle quote - another try (added a couple of spaces):

< script type="text/javascript" src="http://www.factor-li.nl/modules/editorial/jquery_002.js">[removed]

[razaro]

The forums strip all href, img and script tags for security reasons. I get around these problems in my code contributions by changing <a href to <a href, <img src to <img src and <script> to <script>.

You need cufon.js and somefont.js linked and then try this

<script>
{literal}
Cufon.replace(”.sf-menu a”, { hover: true })(‘h4’)(‘h3’)(’#home_slideshow > #slide_navigation > a’);
{/literal}
</script>

[bexvlad]

The forums strip all href, img and script tags for security reasons. I get around these problems in my code contributions by changing <a href to <a href, <img src to <img src and <script> to <script>.

You need cufon.js and somefont.js linked and then try this

<script>
{literal}
Cufon.replace(”.sf-menu a”, { hover: true })(‘h4’)(‘h3’)(’#home_slideshow > #slide_navigation > a’);
{/literal}
</script>

Thanks for the 'quote' tip.

I do have the js enclosed in {literal} brackets and I don't quite understand what you mean by linking cufon.js and somefont.js. I have installed the replacement font and the cufon-yui.js files and they are working in some places in the site. I think I am just stuck on the correct way to specify the slide nav text that needs to be replaced.

[razaro]

I don't quite understand what you mean by linking cufon.js and somefont.js. I have installed the replacement font and the cufon-yui.js

I meant bolded text but i wasn't clear enough.

If you delete all styles in prod.css you should see that replacement works, at least
for me worked.I tried to pinpoint what causing problems but i failed.