webgui/www/extras/colorpicker/example.html
2008-03-04 21:35:03 +00:00

46 lines
2.7 KiB
HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Yahoo! UI Library - Slider Widget</title>
<link rel="stylesheet" type="text/css" href="/extras/yui/build/container/assets/skins/sam/container.css" />
<link rel="stylesheet" type="text/css" href="/extras/yui/build/colorpicker/assets/skins/sam/colorpicker.css" />
<script type="text/javascript" src="/extras/yui/build/yahoo/yahoo-min.js" ></script>
<script type="text/javascript" src="/extras/yui/build/event/event-min.js" ></script>
<script type="text/javascript" src="/extras/yui/build/dom/dom-min.js" ></script>
<script type="text/javascript" src="/extras/yui/build/dragdrop/dragdrop-min.js"></script>
<script type="text/javascript" src="/extras/yui/build/utilities/utilities.js" ></script>
<script type="text/javascript" src="/extras/yui/build/container/container-min.js"></script>
<script type="text/javascript" src="/extras/yui/build/slider/slider-min.js"></script>
<script type="text/javascript" src="/extras/yui/build/colorpicker/colorpicker-min.js"></script>
<script type="text/javascript">
function getWebguiProperty (propName) {
var props = new Array();
props["extrasURL"] = "/extras/";
props["pageURL"] = "/home";
return props[propName];
}
</script>
<link rel="stylesheet" type="text/css" href="colorpicker.css" />
<script type="text/javascript" src="colorpicker.js"></script>
</head>
<body>
<form>
<div>
<a href="#" id="color_formId_swatch" style="width: 20px; height: 20px; background-color: #008000; border: 1px solid black; float: left;"></a>
<input maxlength="7" name="color" type="text" size="8" value="#008000" id="color_formId" />
<script type="text/javascript">YAHOO.WebGUI.Form.ColorPicker.attach('color_formId', 'color_formId_swatch')</script>
</div>
<div>
<a href="#" id="color2_formId_swatch" style="width: 20px; height: 20px; background-color: #008000; border: 1px solid black; float: left;" onclick="YAHOO.WebGUI.Form.ColorPicker.display('color2_formId', 'color2_formId_swatch'); return false"></a>
<input onchange="YAHOO.util.Dom.setStyle('color2_formId_swatch', 'background-color', this.value);" maxlength="7" name="color2" type="text" size="8" value="#008000" id="color2_formId" />
</div>
<div>
<a href="#" id="color3_formId_swatch" style="width: 20px; height: 20px; background-color: #008000; border: 1px solid black; float: left;" onclick="YAHOO.WebGUI.Form.ColorPicker.display('color3_formId', 'color3_formId_swatch'); return false"></a>
<input onchange="YAHOO.util.Dom.setStyle('color3_formId_swatch', 'background-color', this.value);" maxlength="7" name="color3" type="text" size="8" value="#008000" id="color3_formId" />
</div>
</form>
</body>
</html>