Posted By

iTony on 01/15/08


Tagged


Versions (?)

Outline text


 / Published in: JavaScript
 

URL: http://stylizedweb.com/2008/01/13/outline-text-with-js/

this would outline a string. it is up to you how to choose the string. maybe an element in html.

  1. <script>
  2. <!–
  3.  
  4. var message=”outline”;
  5. var thickness=1;
  6. var color2=”black”;
  7. var color1=”white”;
  8. var extra=”font-size:40px;”;
  9. var x = -thickness;
  10. var y = -thickness;
  11.  
  12. while (y<=thickness) {
  13. while (x<=thickness) {
  14.  
  15. document.write (”<span style=’”+extra+” color:”+color2+”; position:absolute; left:”+x+”; top:”+(-y)+”;’>”+message+”</span>”);
  16. document.write (”<span style=’”+extra+” color:”+color2+”; position:absolute; left:”+x+”; top:0;’>”+message+”</span>”);
  17. document.write (”<span style=’”+extra+” color:”+color2+”; position:absolute; left:”+x+”; top:”+y+”;’>”+message+”</span>”);
  18.  
  19. x=x+1;
  20. }
  21. y=y+1;
  22. }
  23.  
  24. document.write (”<span style=’”+extra+” color:”+color1+”; position:absolute; left:0; top:0;’>”+message+”</span>”);
  25.  
  26. //–>
  27. </script>

Report this snippet  

You need to login to post a comment.