Cufon et Jquery Magic Preview

Question

Jquery Magic aperçu permet à un utilisateur d'entrer dans le texte et l'avoir mise à jour automatique (un peu comme ce "champ de soumission" fonctionne avec le chargement de l'aperçu ci-dessous!). Je voudrais que l'utilisateur puisse entrer dans le texte et ensuite la police de Cufon pour prendre en charge ce qu'ils ont écrit (ou juste l'avoir tapé dans la police de Cufon).

$(function() { 
$('form.example input:text').magicpreview('mp_'); 
}); 

Cufon.replace('p#mp_trythis1'); 

Un exemple ici: http://twmorton.com/magicpreviewjquery/

Answer 1

Bon, un meilleur exemple de ce que je besoin serait aperçu d'une police, comme sur ce site:

http://www.fontspace.com/mario-arturo/sahara

Lorsque vous tapez dans ce vous avez besoin, quel que soit le script exécutant l'aperçu actualise l'aperçu pour vous montrer ce que vous avez tapé.

Answer 2

Voici une version simplifiée (sans magicpreview):

La partie html:

<h1>Cufon Test</h1> 
<input id="in" type="text"> 
<div id="out"><h1>Start typing ...</h1></div> 

La partie javascript:

Cufon.replace('h1'); 
$('#in').keyup(function(){ 
    $('#out').html('<h1>'+$(this).val()+'</h1>'); 
    Cufon.replace('#out h1'); 
}); 

Voir un exemple en direct here

EDIT : vous pouvez voir deux versions alternatives here im implémenté en tant que plugins jQuery.

• mises à jour v1 @ 1000 ms après mise au point perdu & que si elles sont sales
• v2 mises à jour @ 1000 ms après la dernière keyup