Letter Shadows from User Input

Question

Goal: User types name into user input field, selects Animate button, and name is printed vertically with each letter containing a drop shadow of each letter. The Javascript li

Answer 1

Do you really need raphael? What I did was simply print out your words onto an element and get the shadow with css's text-shadow. To get the vertical text I added a
after each letter.

Take a look at the fiddle: http://jsfiddle.net/joplomacedo/wVGbF/

Here's the code in case you can't see the fiddle:

HTML

Text:  
      
      

CSS

.print {
    font: 44px/0.8em "Lobster", cursive;
    color: gold;
    text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
}​

JS

var join = Array.prototype.join;

$('#animateBtn').on('click', function() {
    var txt = $('#words').val(),
        spaced_txt = join.call(txt, "
");

    $('.print').html(spaced_txt);
});​