选色器

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#container{width:120px;height:30px;background:#000;opacity:0.7;text-align:center;color:#FFF;font:12px/30px tahoma;display:none;position:absolute;z-index:5555;}
</style>
</head>

<body>
<script type="text/javascript" language="javascript">
var ColorHex=new Array(‘00‘,‘33‘,‘66‘,‘99‘,‘CC‘,‘FF‘)
var SpColorHex=new Array(‘FF0000‘,‘00FF00‘,‘0000FF‘,‘FFFF00‘,‘00FFFF‘,‘FF00FF‘)
var current=null
window.onload=function(){
var colorTable=‘‘
for (i=0;i<2;i++){
for (j=0;j<6;j++){
colorTable=colorTable+‘<tr height=15>‘
colorTable=colorTable+‘<td width=15 style="background-color:#000000">‘
if (i==0){
colorTable=colorTable+‘<td width=15 style="cursor:pointer;background-color:#‘+ColorHex[j]+ColorHex[j]+ColorHex[j]+‘" onmouseover="domouseover(this.style.backgroundColor)">‘
}
else{
colorTable=colorTable+‘<td width=15 style="cursor:pointer;background-color:#‘+SpColorHex[j]+‘" onmouseover="domouseover(this.style.backgroundColor)">‘
}
colorTable=colorTable+‘<td width=15 style="background-color:#000000">‘
for (k=0;k<3;k++){
for (l=0;l<6;l++){
colorTable=colorTable+‘<td width=15 style="cursor:pointer;background-color:#‘+ColorHex[k+i*3]+ColorHex[l]+ColorHex[j]+‘" onmouseover="domouseover(this.style.backgroundColor)">‘
}
}
}
}
colorTable=‘<table border="0" cellspacing="0" cellpadding="0" style="border:1px #000000 solid;border-bottom:none;border-collapse: collapse;width:337px;" bordercolor="000000">‘
+‘<tr height=20><td colspan=21 bgcolor=#ffffff style="font:12px tahoma;padding-left:2px;">‘
+‘<span style="float:left;color:#999999;">鼠标滑动显示色块选择颜色值</span>‘
// +‘<span style="float:right;padding-right:3px;cursor:pointer;" onclick="colorclose()">×关闭</span>‘
+‘</td></table>‘
+‘<table border="1" cellspacing="0" cellpadding="0" style="border-collapse: collapse" bordercolor="000000" style="cursor:pointer;">‘
+colorTable+‘</table>‘;
document.getElementById("colorpane").innerHTML=colorTable;
var current_x = document.getElementById("inputcolor").offsetLeft;
var current_y = document.getElementById("inputcolor").offsetTop;
document.getElementById("colorpane").style.left = current_x + "px";
document.getElementById("colorpane").style.top = current_y + "px";
}
function domouseleave(){
document.getElementById("container").style.display = "none";
}

function domouseover(obj){
document.getElementById("inputcolor").value=obj;
document.getElementById("colorpane").style.display = "block";
document.getElementById("container").innerHTML=obj;

document.onmousemove = function(e){
if(window.event) e = window.event;
var mydiv = document.getElementById("container");
mydiv.style.display = "block";
mydiv.style.left = e.clientX + 15 + "px";
mydiv.style.top = e.clientY + 15 + "px";

if(domouseover(obj)==false)
{ mydiv.style.display = "none";}
if(domouseover(obj)==true)
{return domouseleave();}

}
}
</script>
<div id="container"> </div>
<input name="color" type="text" id="inputcolor" />
<div id="colorpane" style="position:absolute;z-index:999;margin-top:20px;" onmouseleave="domouseleave()"></div>
</body>
</html>

时间: 2024-10-16 07:10:31

选色器的相关文章

采购销售管理系统

{采购销售管理系统} 软件项目总结报告 编号:-{pss}-CLOSUREREPORT 版本:1.0 变更记录 1 项目信息 2 项目说明 [本项目主要用于母婴店人事管理,采购管理,商品管理为一体的后台管理系统] 3 项目周期 1)项目进度总结: 项目共一个项目组(6人)总共耗时180天 3)改进措施: [项目为初级版本,后序迭代完善更多业务功能] 软件项目阶段性总结报告 采购销售管理系统阶段性总结报告 宝贝王有限公司 1. 引言 a) 编写目的 延展用户可读性 b) 背景 采购销售系统基于母婴

微信小程序开发之视频播放器 弹幕 弹幕颜色自定义

把录音的模块尝试过之后就想着微信小程序的视频播放会不会更有趣? 果然,微信小程序视频自带弹幕.是不是很爽,跟我一起来看看. 微信小程序开发之录音机 音频播放 动画 (真机可用) 先上gif: 再上几张图: 1.视频播放器 2.选择弹幕颜色 3.弹幕来了... 1.视频播放器 微信已经封装的非常好.我这里只用了很简单的几个属性 由于以前没做过弹幕,看到danmu-list就激动了.而且只需要将弹幕内容加入集合即可. 弹幕列表的元素: { text: '第 1s 出现的红色弹幕',//文本 colo

BZOJ 1013: [JSOI2008]球形空间产生器sphere

二次联通门 : BZOJ 1013: [JSOI2008]球形空间产生器sphere /* BZOJ 1013: [JSOI2008]球形空间产生器sphere 高斯消元 QAQ SB的我也能终于能秒题了啊 设球心的坐标为(x,y,z...) 那么就可以列n+1个方程,化化式子高斯消元即可 */ #include <cstdio> #include <iostream> #include <cstring> #define rg register #define Max

Day4 - 迭代器&amp;生成器、装饰器、Json &amp; pickle 数据序列化、软件目录结构规范

---恢复内容开始--- 本节内容 迭代器&生成器 装饰器 Json & pickle 数据序列化 软件目录结构规范 作业:ATM项目开发 1.列表生成式,迭代器&生成器 列表生成式 需求:列表a = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],要求把列表里的每个值加1 1 a = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 2 b = [] 3 for i in a: 4 b.append(i+1) 5 a = b 6 print(a) 普通青

python3 装饰器

看廖雪峰官网的python3装饰器有感 装饰器即将一个函数作为变量在新的函数中调用此函数. 作业: 能否写出一个@log的decorator,使它既支持: @logdef f():     pass 又支持: @log('execute')def f():     pass      例1: import functools import time def log(*args,**kwargs):     # *args 是个元组     if args and isinstance(args,

java web 过滤器跟拦截器的区别和使用

1.首先要明确什么是拦截器.什么是过滤器 1.1 什么是拦截器: 拦截器,在AOP(Aspect-Oriented Programming)中用于在某个方法或字段被访问之前,进行拦截然后在之前或之后加入某些操作.拦截是AOP的一种实现策略. 在Webwork的中文文档的解释为--拦截器是动态拦截Action调用的对象.它提供了一种机制可以使开发者可以定义在一个action执行的前后执行的代码,也可以在一个action执行前阻止其执行.同时也是提供了一种可以提取action中可重用的部分的方式.

微信小程序(5)--阅读器

最近用微信小程序写了一个图书阅读器,可以实现左右滑动翻页,按钮翻页,上下滚动,切换背景,控制字体大小.以及记住设置好的状态,如页面再次进来保留上次的背景色和字体大小. 由于暂时没有真实的数据接口,所以我用了静态数据. <!-- 文本 --> <view class="container" style="background:{{bodyColor}}"> <!-- 中间层,点击,头部底部显示 --> <view class=

微信小程序之页面拦截器

场景 小程序有52个页面,其中13个页面无需任何身份,另外39个页面需要系统角色.对于这39个页面,如果微信用户没有系统角色,则跳转到登录页.是否有系统角色信息需要通过异步请求来获取. 需求分析&实现 对需求进行抽象,其实要的就是一个过滤器,对小程序页面的访问进行过滤,符合条件的通过,不符合条件进行其他处理. 使用过php的laravel框架的童鞋,肯定一下子就联想到了laravel框架的http中间件:HTTP 中间件提供一个方便的机制来过滤进入应用程序的 HTTP 请求,例如,Laravel

day14 带函数的装饰器、多个装饰器装饰一个函数

一.带参数的装饰器:------开关 __author__ = 'Administrator' F=True def outer(F): def wap(fun):#gg def inner(*args,**kwargs): if F: print("inner before") ret=fun(*args,**kwargs)#gg() print("inner after") else: ret=fun(*args,**kwargs) return ret ret