Hi,
a design coder is using Cufon to get the desired font. This works well when the page first loads but when I change pages via a radtabstrip , the font formating dissapears.
I have seen several examples that use the OnResponseEnd event of the RadAjaxManager to fire Cufon.refresh(), but this removes all the text so that no h2 tags appear on the page.
I'm using the code:
Anybody have any ideas?
Regards
Roger
a design coder is using Cufon to get the desired font. This works well when the page first loads but when I change pages via a radtabstrip , the font formating dissapears.
I have seen several examples that use the OnResponseEnd event of the RadAjaxManager to fire Cufon.refresh(), but this removes all the text so that no h2 tags appear on the page.
I'm using the code:
function
responseEnd(sender, eventArgs) {
Cufon.replace(
'h1'
, { hover:
true
});
Cufon.replace(
'h2'
, { hover:
true
});
Cufon.now();
}
Anybody have any ideas?
Regards
Roger
7 Answers, 1 is accepted
0

sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
answered on 07 Sep 2011, 02:12 AM
If you're using an Ajax callback, then yeah the Cufon will need to be re-applied...I can't see why the code below WOULDN'T work.
Like if you open Firefox\Firebug in the Console tab, are there any script errors generated? Optionally can you manually call the Cufon code below in the Console tab?
Like if you open Firefox\Firebug in the Console tab, are there any script errors generated? Optionally can you manually call the Cufon code below in the Console tab?
0

Roger
Top achievements
Rank 1
answered on 08 Sep 2011, 09:06 AM
Hi Steve,
thanks for the advice.
Used firebug:
thanks for the advice.
Used firebug:
- no errors reported
- when script run manually, everything runs ok but no changes made to script.
Console just says the following
>>> Cufon.replace('h2'); Cufon.now();
>>> Cufon.replace('h2'); Cufon.now();
must be something else to do with ajax.
Roger
0

sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
answered on 08 Sep 2011, 03:13 PM
Hmmm, in the OnResponseEnd set a timeout of like 5 seconds, then call the Cufon, what happens?
0

Roger
Top achievements
Rank 1
answered on 11 Sep 2011, 05:40 AM
Hi Steve,
no again...waits 5 seconds and runs the cufon.refresh but no change to text. To explain more, I have a tabstrip with 2 pageviews. When the page first appears all the h1/h2 tags are modified to my new font. When I cleck the tab ab\nd go to another pageview, the font doesn't change and I get the old h1/h2 fonts. Also when I then click the tab to go back to the original page then the old fonts appear.
The ajaxmanager is in a master page with the rest in a content page.Everything "appears" to be working with no errors but the fonts will not change.
There is nothing fancy in the content page.
Regards
Roger
no again...waits 5 seconds and runs the cufon.refresh but no change to text. To explain more, I have a tabstrip with 2 pageviews. When the page first appears all the h1/h2 tags are modified to my new font. When I cleck the tab ab\nd go to another pageview, the font doesn't change and I get the old h1/h2 fonts. Also when I then click the tab to go back to the original page then the old fonts appear.
The ajaxmanager is in a master page with the rest in a content page.Everything "appears" to be working with no errors but the fonts will not change.
There is nothing fancy in the content page.
Regards
Roger
0
Hi Roger,
In order to troubleshoot your issue, please open a support ticket and provide us with a runnable sample page so we could examine it locally in order to find a solution.
Regards,
Dimitar Terziev
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
In order to troubleshoot your issue, please open a support ticket and provide us with a runnable sample page so we could examine it locally in order to find a solution.
Regards,
Dimitar Terziev
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0

Roger
Top achievements
Rank 1
answered on 25 Oct 2011, 06:08 AM
Found the solution. The cufon scripts aren't reloading after the ajax call. You need to:
(a) put a reference to jquery above the cufon script references
(b) add an "onResponseEnd" client event to RadAjaxManager
(c) add the onResponseEnd function that loads the cufon scripts and then refreshes after each ajax call
note that the URL is the url where your scripts are on your website.
(a) put a reference to jquery above the cufon script references
<
script
src
=
"../Scripts/jquery-1.4.1.js"
type
=
"text/javascript"
></
script
>
<
script
type
=
"text/javascript"
src
=
"../Scripts/cufon/cufon-yui.js"
></
script
>
<
script
type
=
"text/javascript"
src
=
"../Scripts/cufon/Harabara_700.font.js"
></
script
>
<
script
type
=
"text/javascript"
src
=
"../Scripts/cufon/cufon-load.js"
></
script
>
(b) add an "onResponseEnd" client event to RadAjaxManager
<
telerik:RadAjaxManager
ID
=
"RadAjaxMaster"
runat
=
"server"
>
<
ClientEvents
OnResponseEnd
=
"responseEnd"
/>
</
telerik:RadAjaxManager
>
(c) add the onResponseEnd function that loads the cufon scripts and then refreshes after each ajax call
function
responseEnd(sender, eventArgs) {
$.ajax({ url:
'../Scripts/cufon/cufon-yui.js'
});
$.ajax({ url:
'../Scripts/cufon/Harabara_700.font.js'
});
$.ajax({ url:
'../Scripts/cufon/cufon-load.js'
});
Cufon.refresh();
}
note that the URL is the url where your scripts are on your website.
0
Hi Roger,
I'm glad that the problem is now solved and thank you for sharing the solution.
Best wishes,
Dimitar Terziev
the Telerik team
I'm glad that the problem is now solved and thank you for sharing the solution.
Best wishes,
Dimitar Terziev
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now