|
Farbgenerator
| Ist ein einfacher Farbgenerator
|
| Script: |
<form name="rbt"></center>
<center>
<table BORDER=0 CELLSPACING=0 CELLPADDING=0
COLS=1 WIDTH="400" >
<tr>
<td> <p
align="center"><b><font color="#000000">Text</font></b></p></td>
</tr>
<tr>
<td> <p
align="center">
<input
type="text" name="text" size=50 value=""
style="font-family: Verdana; color: #000000; font-size: 8pt;
border: 1 solid #000000">
</p></td>
</tr>
<tr>
<td> <b><font
color="#000000">Farbverlauf</font></b>
</td>
</tr>
<tr>
<td> <center>
<table
BORDER=0 CELLSPACING=0 CELLPADDING=0 width="343" >
<tr>
<td
WIDTH="68"></td>
<td
width="68"> <center>
<b>Anfang</b></center></td>
<td
WIDTH="69"></td>
<td
WIDTH="69"></td>
<td
width="69"> <center>
<b>Ende</b></center></td>
</tr>
<tr>
<td
width="68"><b><font color="#FF0000">ROT</font></b></td>
<td
width="68"><input type="text" name="r1"
size=6 value=255 style="font-family: Verdana; color: #000000;
font-size: 8pt; border: 1 solid #000000"></td>
<td
width="69"></td>
<td
width="69"><b><font color="#FF0000">ROT</font></b></td>
<td
width="69"><input type="text" name="r2"
size=6 value=0 style="font-family: Verdana; color: #000000;
font-size: 8pt; border: 1 solid #000000"></td>
</tr>
<tr>
<td
width="68"><b><font color="#009900">GRÜN</font></b></td>
<td
width="68"><input type="text" name="g1"
size=6 value=0 style="font-family: Verdana; color: #000000;
font-size: 8pt; border: 1 solid #000000"></td>
<td
width="69"></td>
<td
width="69"><b><font color="#009900">GRÜN</font></b></td>
<td
width="69"><input type="text" name="g2"
size=6 value=0 style="font-family: Verdana; color: #000000;
font-size: 8pt; border: 1 solid #000000"></td>
</tr>
<tr>
<td
width="68"><b><font color="#3366FF">BLAU</font></b></td>
<td
width="68"><input type="text" name="b1"
size=6 value=0 style="font-family: Verdana; color: #000000;
font-size: 8pt; border: 1 solid #000000"></td>
<td
width="69"></td>
<td
width="69"><b><font color="#3366FF">BLAU</font></b></td>
<td
width="69"><input type="text" name="b2"
size=6 value=255 style="font-family: Verdana; color: #000000;
font-size: 8pt; border: 1 solid #000000"></td>
</tr>
</table>
</center></td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td> <center>
<input
type="button" value=" Berechnen " onclick="berechne()"
style="font-family: Verdana; color: #000000; font-size: 8pt;
border: 1 solid #000000">
</center></td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
</center>
<div align="center">
<center><table BORDER="0" CELLSPACING=0
CELLPADDING=0 width="401" >
<tr>
<td width="397">
<p align="center"><b>Der <font color="#000000">HTML</font>-Code<br>
</b>
<textarea rows="10" name="out" cols="50"
style="font-family: Verdana; color: #000000; font-size: 8pt;
border: 1 solid #000000"></textarea></p>
</td>
</tr>
<center>
<tr>
<td width="397"> </td>
</tr>
<tr>
<td width="397">
<center><input type="button" value="
Quellcode markieren " onclick="Javascript:this.form.out.focus();this.form.out.select()"
style="font-family: Verdana; color: #000000; border: 1 solid
#000000">
<input type="button" value=" Vorschau "
onclick="vorschau()" style="font-family: Verdana;
color: #000000; border: 1 solid #000000"></center>
</td>
</tr>
<tr>
<td width="397">
</td>
</tr>
</table></center>
</div>
</form>
<script LANGUAGE="JavaScript1.2">
<!-- Copyright: localx.info, 2003 -->
var r1=0, r2=0, rs=0, rh, rh1=0, rh2=0
var g1=0, g2=0, gs=0, gh, gh1=0, gh2=0
var b1=0, b2=0, bs=0, bh, bh1=0, bh2=0
var anzahl=0, farbe="", txt="", l=""
var hex="0123456789ABCDEFGHIJKLMNOPQRSTUVWQYZ"
function berechne()
{
text=document.rbt.text.value
anzahl=text.length
if (anzahl<1) {
alert("So ein Quatsch !\nDer Text sollte schon etwas länger
sein")
return
}
r1=document.rbt.r1.value
r2=document.rbt.r2.value
g1=document.rbt.g1.value
g2=document.rbt.g2.value
b1=document.rbt.b1.value
b2=document.rbt.b2.value
if (r1<0 || r1>255 || g1<0 || g1>255 || b1<0 ||
b2>255 || r2<0 || r2>255 || g2<0 || g2>255 || b2<0
|| b2>255) {
alert("Ein Farbenwert ist falsch !\nGültige Werte: 0 -
255\n")
return
}
rs=parseInt((r2-r1)/(anzahl-1))
gs=parseInt((g2-g1)/(anzahl-1))
bs=parseInt((b2-b1)/(anzahl-1))
r=Math.round(r1)
g=Math.round(g1)
b=Math.round(b1)
l=""
//if (document.rbt.gr[0].checked) {l='<font face=Verdana><font
size=1><b>'}
//if (document.rbt.gr[1].checked) {l='<font face=Verdana><font
size=2><b>'}
//if (document.rbt.gr[2].checked) {l='<font face=Verdana><font
size=3><b>'}
//if (document.rbt.gr[3].checked) {l='<font face=Verdana><font
size=4><b>'}
for (i=0; i<anzahl; i++) {
wfarben()
l=l+'<font color='+farbe+'>'+text.substr(i,1)+'</font>'
r=r+rs
g=g+gs
b=b+bs
if (r<0) {r=0}
if (g<0) {g=0}
if (b<0) {b=0}
if (r>255) {r=255}
if (g>255) {g=255}
if (b>255) {b=255}
}
l=l+''
document.rbt.out.value=l
}
function wfarben() {
rh1=Math.floor(r/16)
rh2=r-(rh1*16)
rh=hex.substr(rh1,1)+hex.substr(rh2,1)
gh1=Math.floor(g/16)
gh2=g-(gh1*16)
gh=hex.substr(gh1,1)+hex.substr(gh2,1)
bh1=Math.floor(b/16)
bh2=b-(bh1*16)
bh=hex.substr(bh1,1)+hex.substr(bh2,1)
farbe=""+rh+gh+bh
}
function vorschau() {
berechne()
a=window.open("","")
a.focus()
a.document.write("<html><body>\n")
a.document.write(l)
a.document.close()
a.focus()
}
</script>
</center>
|
|
Home
Startseite
Tutorials
Die Möglichkeit diesen Artikel zu verlinken
: