»
AnglaisFran�aisVietnamien

Imprimer - Outline/Shadow Text - JavaScriptBank.com

Version compl�te: jsB@nk » Texte » Fade-Glow » Outline/Shadow Text
URL: https://www.javascriptbank.com/outlineshadow-text.html

Outline/Shadow Text © JavaScriptBank.comCet exemple montre comment construire un plan interactif qui se développe et s'effondre.

Version compl�te: jsB@nk » Texte » Fade-Glow » Outline/Shadow Text
URL: https://www.javascriptbank.com/outlineshadow-text.html



JavaScript
<script><!--//Author: Anthony Ryan Delorie//My email: [email protected] ShadeIt(message,range,color1,color2,extra) {var x = range;var y = range;document.write ("<span style='"+extra+" color:"+color2+"; position:absolute\; left:"+x+"; top:"+y+";'>"+message+"</span>");document.write ("<span style='"+extra+" color:"+color1+"; position:absolute; left:0; top:0;'>"+message+"</span>");}function OutIt(message, thickness, color1, color2, extra) {var x = -thickness;var y = -thickness;while (y<=thickness) {while (x<=thickness) {document.write ("<span style='"+extra+" color:"+color2+"; position:absolute; left:"+x+"; top:"+(-y)+";'>"+message+"</span>");document.write ("<span style='"+extra+" color:"+color2+"; position:absolute; left:"+x+"; top:0;'>"+message+"</span>");document.write ("<span style='"+extra+" color:"+color2+"; position:absolute; left:"+x+"; top:"+y+";'>"+message+"</span>");x=x+1;}y=y+1;} document.write ("<span style='"+extra+" color:"+color1+"; position:absolute; left:0; top:0;'>"+message+"</span>");}//--></script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<a href="javascript:OutIt('outline text', 1, 'silver', 'navy', 'font-size:40px;');">outline link</a> |<a href="javascript:ShadeIt('shadow text', 2, 'orange', 'maroon', 'font-size:40px;');">shadow link</a><div style="position: relative; width: 50%;"><script><!--OutIt('outline text', 1, 'black', 'silver', 'font-size:40px;');//--></script></div><div style="position: relative; width: 50%; top: 50px;"><script><!--var message="outline text";var thickness=1;var color2="darkred";var color1="red";var extra="font-size:40px;";var x = -thickness;var y = -thickness;while (y<=thickness) {while (x<=thickness) {document.write ("<span style='"+extra+" color:"+color2+"; position:absolute; left:"+x+"; top:"+(-y)+";'>"+message+"</span>");document.write ("<span style='"+extra+" color:"+color2+"; position:absolute; left:"+x+"; top:0;'>"+message+"</span>");document.write ("<span style='"+extra+" color:"+color2+"; position:absolute; left:"+x+"; top:"+y+";'>"+message+"</span>");x=x+1;}y=y+1;} document.write ("<span style='"+extra+" color:"+color1+"; position:absolute; left:0; top:0;'>"+message+"</span>");//--></script></div><div style="position: relative; width: 50%; top: 100px;"><script><!--var message="shadow text";var range=1;var extra="font-size:40px;";var color1="blue";var color2="navy";var x = range;var y = range;document.write ("<span style='"+extra+" color:"+color2+"; position:absolute\; left:"+x+"; top:"+y+";'>"+message+"</span>");document.write ("<span style='"+extra+" color:"+color1+"; position:absolute; left:0; top:0;'>"+message+"</span>");//--></script></div><div style="position: relative; width: 50%; top: 150px;"><script><!--ShadeIt('shadow text', 3, 'orange', 'maroon', 'font-size:40px;');//--></script></div><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->