Javascript Color picker
Posted: Fri Dec 21, 2007 11:18 am
-Edited-
A community of PHP developers offering assistance, advice, discussion, and friendship.
http://forums.devnetwork.net/
Code: Select all
function setcolor(Color){
alert(Color + ' wants to be set to something!');
}Kieran Huggins wrote:http://acko.net/dev/farbtastic
Code: Select all
function setColor(color, element)
{
//set the color
document.getElementById(element).value = color;
}Code: Select all
,Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Thats cool and all.. But since you say you have made myspace things.
Then you also know it helps to put them in a textarea tag.
For some reason the script isn't running on the textarea is there a way to tell it to run and then generate what i want..
What I'm making is a falling object generator. Yes i know i can go online almost anywhere and find one.
But you can't learn how it works unless you build it, so thats what I'm trying to do.
[syntax="html"]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="farbtastic.js"></script>
<link rel="stylesheet" href="farbtastic.css" type="text/css" />
<style type="text/css" media="screen">
.colorwell {
border: 2px solid #fff;
width:
6em;
text-align: center;
cursor: pointer;
}
body .colorwell-selected {
border: 2px solid #000;
font-weight: bold;
}
</style>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#demo').hide();
var f = $.farbtastic('#picker');
var p = $('#picker').css('opacity',
0.25);
var selected;
$('.colorwell')
.each(function () { f.linkTo(this);
$(this).css('opacity', 0.75); })
.focus(function() {
if (selected) {
$(selected).css('opacity', 0.75).removeClass('colorwell-selected');
}
f.linkTo
(this);
p.css('opacity', 1);
$(selected = this).css('opacity', 1).addClass
('colorwell-selected');
});
});
</script>
</head>
<body>
<p>Please select the color number. Then use the item to your right to change it.</p>
<form action="" style="width: 500px;">
<div id="picker" style="float: right;">
</div>
<div class="form-item">
<label for="color1">Color 1:</label>
<input type="text" id="color" name="color1" class="colorwell" value="#123456" />
</div>
</form>
<Textarea cols="40" rows="10" onfocus="this.select();">
<script type="text/javascript">
<Textarea cols="30" rows="4">
function setColor(color, element)
{
//set the color
document.getElementById(element).value = color;
}
</Textarea>
</Form>
</script>
</body>
</html>
Code: Select all
,Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]