Removing Cufon once it has been loaded

I know this is a bit of a bizarre one, but I am using Cufon on one of my pages, but I need to be able to turn it off for all elements if the user presses a button.

Now I was hoping there would be like a Cufon.Reset(selector) or something, but I couldnt find anything, so is the开发者_JS百科re any way to turn Cufoned text back into standard text without refreshing the page?

Don't think so. Cufon is creating an img. So undoing it without page refresh is not possible.

You could write some script to:

• copy text(copy html tag and hide it) before Cufon is run on it
• than on button click hide cufon and show copied text element with pure text

I would suggest using @font-face rather than Cufon- works great on IE, FF, Safari. Chrome is let say 80% quality.

Check out this website - it is using @font-face method. Working perfectly.

Let say all of your H1 tags are with cufont style. To perform this you will use:

Cufon.replace('h1');

if you want to revert cufon action you can use:

$('h1').each(function(){
    $(this).find('cufon').each(function(){
        $(this).replaceWith($(this).find('cufontext').text())
    })
})

var RemoveCufon = function (selector) {
    $(selector).each(function (index, element) { $(element).text(BuildCufonTextString(element)); });
};

var BuildCufonTextString = function (parent) {
    var elementText = "";
    $("cufon cufontext", parent).each(function (index, element) { elementText += $(element).text(); });
    return $.trim(elementText);
};

Here is a manual way of doing it which works, but would like to know of anything simpler...

I just went through the whole process of implementing a simpler version of one of the scripts discussed here in order to get the text out of the cufontext tags. It was working just fine:

var nameFromCufon = $(profileName).find('cufontext').each(function(){
    $(this).replaceWith($(this).text())
})

ProfileName is the immediate parent span tag surrounding the cufon tags. Then I tried something so simple it was too obvious: $(profileName).text();

.text give me just the text with all the tag code stripped out. So simple.