本文目录一览：
图片上传前用JS代码进行预览并编辑裁剪区域
的图片上传功能后可以实现区域截图,也可以实现放大缩小...估计是用了JS来实现的:
var div_move = 0;
var IE = document.all?true:false;
var tempX,tempY,oldX,oldY;
var have_move = 0;
function grasp()
{
div_move = 1;
if(IE)
{
document.getElementById("source_div").setCapture();
}
}
function free()
{
div_move = 0;
have_move = 0;
document.getElementById("source_div").releaseCapture();
}
function getMouseXY(e)
{
if (IE)
{ // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft
tempY = event.clientY + document.body.scrollTop
}
else
{
// grab the x-y pos.s if browser is NS
tempX = e.pageX
tempY = e.pageY
}
// catch possible negative values in NS4
if (tempX 0){tempX = 0}
if (tempY 0){tempY = 0}
}
function move_it(e)
{
getMouseXY(e);
if(div_move == 1)
{
if(have_move == 0)
{
//alert('a');
oldX = tempX;
oldY = tempY;
have_move = 1;
}
var left = parseInt(document.getElementById("source_div").style.left);
var top = parseInt(document.getElementById("source_div").style.top);
//alert(top);
//alert(left);
//alert(tempX);
//alert(oldX);
document.getElementById("source_div").style.left = left + tempX - oldX;
document.getElementById("source_div").style.top = top + tempY - oldY;
oldX = tempX;
oldY = tempY;
}
}
function change_size(method)
{
if(method == 1)
{
var per = 1.25;
}
else
{
var per = 0.8;
}
document.getElementById("show_img").width = document.getElementById("show_img").width*per;
//document.getElementById("show_img").height = document.getElementById("show_img").height*per;
}
function micro_move(method)
{
switch (method)
{
case "up":
var top = parseInt(document.getElementById("source_div").style.top);
document.getElementById("source_div").style.top = top - 5;
break;
case "down":
var top = parseInt(document.getElementById("source_div").style.top);
document.getElementById("source_div").style.top = top + 5;
break;
case "left":
var left = parseInt(document.getElementById("source_div").style.left);
document.getElementById("source_div").style.left = left - 5;
break;
case "right":
var left = parseInt(document.getElementById("source_div").style.left);
document.getElementById("source_div").style.left = left + 5;
break;
}
}
function turn(method)
{
var i=document.getElementById('show_img').style.filter.match(/d/)[0]
//alert(i);
i=parseInt(i)+parseInt(method);
//alert(i);
if(i0)
{
i += 4;
}
if(i=4)
{
i -= 4;
}
//alert(i);
document.getElementById('show_img').style.filter='progid:DXImageTransform.Microsoft.BasicImage(Rotation='+i+')'
}
function mysub()
{
var Oform = document.myform;
Oform.go.value = 1;
Oform.width.value = document.getElementById("show_img").width;
Oform.left.value = document.getElementById("source_div").style.left;
Oform.top.value = document.getElementById("source_div").style.top;
if(IE)
{
Oform.turn.value = document.getElementById('show_img').style.filter.match(/d/)[0];
}
Oform.submit();
}
苹果树下也有类似功能不过,功能要比你所说的强大的多...
资料搜集于百度知道！
js如何做一个取色器
一般的项目可以直接使用开源的插件。
如果要自己做，就要根据需求，把颜色列表数据存储起来。在页面当中显示可以列出的颜色，当鼠标按住移动的时候，根据当前的坐标移动数值，移动滑块。根据滑块的位置确定当前选取的是哪个颜色的值。
js从10种颜色中随机取色实现每次取出不同的颜色
昨天在做js
从10种颜色中随机取色，并每次取出的颜色不同的时候，考虑了很多，最终用如下来实现：
复制代码
代码如下:
var
colorList
=
["#FFFF99","#B5FF91","#94DBFF","#FFBAFF","#FFBD9D","#C7A3ED","#CC9898","#8AC007","#CCC007","#FFAD5C"];
for(var
i=0;ilineList.length;i++){
var
bgColor
=
getColorByRandom(colorList);
}
function
getColorByRandom(colorList){
var
colorIndex
=
Math.floor(Math.random()*colorList.length);
var
color
=
colorList[colorIndex];
colorList.splice(colorIndex,1);
return
color;
}
这样便能每次取出的颜色是随机的且都不一样