jQuery Flash Plugin - Flash Text-Replacement (sIFR)

« Back to the jQuery flash plugin

This example uses a custom flash movie for the font.

John Lennon (Wikipedia Page)

Paul McCartney

George Harrison

Ringo Starré

Javascript:

$(document).ready(function(){
    $('h3').flash(
        { 
            src: 'itc_century.swf', 
            flashvars: { 
                css: [
                    '* { color: #666666; }',
                    'a { color: #0099CC; text-decoration: none; }',
                    'a:hover { text-decoration: underline; }'
                ].join(' ')
            }
        },
        { version: 7 },
        function(htmlOptions) {
            htmlOptions.flashvars.txt = this.innerHTML;
            this.innerHTML = '<div>'+this.innerHTML+'</div>';
            var $alt = $(this.firstChild);
            htmlOptions.height = $alt.height();
            htmlOptions.width = $alt.width();
            $alt.addClass('alt');
            $(this)
                .addClass('flash-replaced')
                .prepend($.fn.flash.transform(htmlOptions));						
        }
    );
});

Before:

<h3>John Lennon</h3>

After:

<h3 class="flash-replaced">
    <embed width="255" height="46" type="application/x-shockwave-flash" src="itc_century.swf" pluginspage="http://www.adobe.com/go/getflashplayer" flashvars="txt=John%20Lennon"/>
    <div style="" class="alt">John Lennon</div>
</h3>