posts - 12,  comments - 0,  trackbacks - 0
调色板
/**
 * 文件:colorpad.js
 * 版本:0.1
 * 作者:young40 || 杨世玲
 * 日期:2008-04-07
 * 作用:弹出一个调色板
 * 网址:http://www.phpweblog.net/young40/
 * 版权:GPL2
 */
var cp_loaded = false;
var postioned = false;
var target_obj = false;
function cp_load()
{
    var p = '';
    p += '<div id="colorpad" style="position:absolute; z-index:10;border:#000000 solid 1px; background-color:#FFF; width:490px;">';
    p += '<div style="text-align:right; cursor:pointer;" onclick="hidecolorpad();">关闭</div>';
    var R = G = B = new Array('0', '3', '6', '9', 'C', 'F');
    
    var colors = '';
    
    for(r in R)
    {
        var _r = R[r] + R[r];
        for(g in G)
        {
            var _g = G[g] + G[g];
            for(b in B)
            {
                var _b = B[b] + B[b];
                var color = _r + _g + _b;    
                colors += ' <a href="javascript:cp_pick(\'' + color + '\');" style="color:#' + color + ';background-color:#' + color + ';" display:block; width:40px;">&nbsp;&nbsp;</a> ';
            }
        }
    }
    p += colors;
    p += '</div>';
    
    var container = document.createElement('div');
    container.id = 'container';
    container.innerHTML = p;
    document.body.appendChild(container);
    cp_loaded = true;
}

function showcolorpad(event, obj)
{
    if(!cp_loaded){ cp_load(); }//加载
    
    if(!postioned)
    {
        var postion = cp_postion(event, obj);//定位
        cp_$('colorpad').style.top     = (postion.y + 20) + 'px';
        cp_$('colorpad').style.left = (postion.x - 250) + 'px';
        postioned = true;
    }    
    
    cp_$('colorpad').style.display = '';//显示
    
    target_obj = obj;//记录需要改变的表单
}

function hidecolorpad()
{
    if(!cp_loaded){return false;}//加载
    
    cp_$('colorpad').style.display = 'none';//隐藏
}

function cp_pick(color)
{
    target_obj.value = '#' + color;
    hidecolorpad();
}

function cp_postion(event, obj)
{
    var p = new Object();
    p.x = event.clientX;
    p.y = event.clientY;

    return p;
}

function cp_$(id)
{
    return document.getElementById(id);
}

/**
调用方法:
<input type="text" onclick="showcolorpad(event, this);">
**/

这是别人写的，转过来备份。

posted on 2008-06-13 08:56 Jarry 阅读(496) 评论(0)  编辑 收藏 引用 网摘 所属分类: Script

只有注册用户登录后才能发表评论。
网站导航:
Powered by:
PHP博客
Copyright ©2024 Jarry