Remplacer des images et du texte HTML en Flash | Tutorial sIFR 3 et swfIR

sIFR (texte - les titulaires)

Web designers ont de nombreuses limitations, le navigateur, la résolution, les normes, l'accessibilité, et que l'utilisation des sources de système. Eh bien pendant un certain temps que ce dernier est une solution est sIFR que des sites tels que le magnifique Critrerion utilisé longue et sans doute d'améliorer le modèle. Il est important que la dernière version bajéis car il a été résolu par exemple le fonctionnement des liens, en utilisant une couleur pour le renversement du véhicule.

Les titres des articles de ce blog, pqpq.es et justtellmewhy.com utiliser sIFR 3.

Téléchargez la dernière version de sIFR:

http://novemberborn.net/sifr3/beta2 (actuellement version 3, vous pouvez obtenir toutes les informations dans ce wiki).

Il s'agit d'une galerie avec plus d'exemples de l'utilisation de sIFR 3:

http://wiki.novemberborn.net/sifr3/Examples

Ce qu'il fait est d'utiliser Flash et Javascript pour rendre un texte avec la source à inclure dans une animation Flash hébergé sur le serveur. Le processus est le suivant:

1. Load XHTML
2. Par une fonction javascript est cochée si elle est installée ou non le lecteur Flash, pour ne pas se regarder le système normal XHTML source.
3. Si vous recherchez des composants est installé, est mesurée et de créer des swf à placer au lieu du texte.

Avantages:

Il est accessible, léger, rapide et cohérente.

Notes:

• Il se pourrait que le texte que vous avez à remplacer un fonds que vous souhaitez conserver. Pas tous les navigateurs sont compatibles avec Flash consomment également plus de transparence de ce paramètre.
• Le menu change.
• Les liens sont perdu la capacité de cliquer avec le bouton central de la souris ou CTRL + clic pour ouvrir une nouvelle fenêtre ou onglet.

Plugin pour Wordpress

Vous pouvez ajouter n'importe quel site, mais si vous utilisez Wordpress mai-être plus facile à installer ce plugin, mais avertissent que ce n'est pas la dernière version:

Custom Font Download plugin Wordpress

Je télécharger et active comme tout plugin, n'oubliez pas de renommer le dossier avant de le télécharger, il suffit custom_fonts.

Vous pouvez choisir parmi une variété de sources que déjà avec le plugin:

'A Charming Font "
«Allstar»
"Arno Pro '
'Beautiful Ink'
«Creaminal '
«Cretino '
«Flowerchild '
«Hirosh '
"Luna Bar"
"Rounded Cent '
«Sonderfistad '
"Tondo"
«Commerce gothique"
'Type Knight'
'Van Den Keera'
'Vivaldi'

Une fois que vous allez sur une conception (Design)> Custom Fonts les règles qui s'appliquent (blocs) d'attribuer un ou d'une autre source que le sélecteur CSS et les pages où elles apparaissent.

Si par exemple vous avez besoin est de changer la nature des titres des messages, vous pouvez mettre le sélecteur ou h1 et h2 prêt.

Mais si vous voulez une autre source, vous avez besoin est de créer le fichier swf avec la police que vous voulez et vous devez avoir installé sur votre ordinateur. Si vous ne le faites comme expliqué sur le site du plugin, vous ne pouvez pas ajouter des glyphes avec des accents, rappelez-vous que les sources qui ne sont pas livrés avec sIFR glyphes, caractères accentués, ou ñ Ñ ou du signe ou de l'interrogatoire d'ouvrir ¿

Télécharger http://novemberborn.net/sifr3/beta2

Ce. Zip contient tous les documents nécessaires et des exemples de mettre n'importe où, y compris Wordpress, sans la nécessité pour le plugin.

1. Flash ouvrir le fichier dans le dossier Flash sifr.fla
2. Double-cliquez sur le MovieClip "détenteur" de la bibliothèque
3. Supprime le texte qui prend moins, si vous souhaitez utiliser ou Bold Italic inséré 1 seul caractère.
4. Propriétés de changer la source.
5. Propriétés et cliquez sur ajouter Incorporer glyphes avec les accents, les enfants et ceux qui en ont besoin.
6. Swf public à ces options

Une fois que vous créez par exemple futuraligth.swf doit télécharger ce dossier:

wp-content/plugins/custom_fonts/sifr/fonts /

Ainsi, vous pouvez utiliser à partir de Design> Custom polices, éditez le fichier "custom_fonts.php", vous verrez une liste des sources décrites ci-dessus pour ajouter votre propre ou ajouter autant de lignes que de sources comme suit:

  $ Cf_fonts [] = "Nouveau nom de police"; 

Options avancées

Si vous ne branchez toujours plus de choix, vous pouvez utiliser l'extension pour Dreamweaver ou de suivre ces étapes:

1. Liens <head> à vos fichiers sifr.js, sIFR-print.css et sIFR-screen.css
2. Editez le fichier dans le dossier js sifr.js et comprend un appel de fonction pour remplacer le texte avec le sélecteur de votre choix:

  var name = (/ /, vous pouvez mettre n'importe quel nom à la variable 

  src: 'tufuente.swf' / / Mettez le chemin de votre fichier créé à l'étape précédente 

  ); SIFR.activate (name); 

  sIFR.replace (nom, ( 

  selector: 'h1', css: [ 'a (text-decoration: none;)', 'a: link (color: # 000000;)', 'a: hover (color: # E2A42B;)] 

  )); 

C'est ce code qui remplace h1 correspondant aux titres des articles de ce blog. Nous demandons que, si quelqu'un a des problèmes de me laisser un commentaire à la configuration de votre ordinateur et votre navigateur.

Rappelez-vous que la dernière version corrige de nombreux bugs, mais encore en version bêta, vous pouvez ajouter des filtres à votre texte Flash

swfIR (photos)

Avec la même technologie a été développée swfIR (swf image de remplacement), mais quelque chose comme sIFR images, dans ce cas sont seulement 3 de télécharger des fichiers à partir d'un zip 11.89 KB:

• Txt 1 avec instructions
• 1 javascript que les flammes de la tête

<script src="swfir.js" type="text/javascript"></script>

• Swf 1 doit également rester dans votre serveur

Enfin, ajouter la commande dans window.onload javascript, vous pouvez modifier tous ces paramètres que des sélecteurs CSS, ou en utilisant le tag img pour toutes les images:

• border-radius
• border-width
• border-color
• shadow-offset
• shadow-angle
• shadow-alpha
• shadow-blur
• x-ombre-flou
• ombre-et-flou
• shadow-force
• shadow-color
• shadow-qualité
• l'intérieur de l'ombre
• shadow-knockout
• shadow-hide
• pivoter
• overflow
• lien
• élasticité