相关疑难解决方法(0)

动态改变图像颜色

我正在开发一个应用程序,它将多个视图显示为表格(例如客户,产品等).每行的最后一列包含按钮,用户可以使用这些按钮对特定行执行某些操作.简化示例:

<td class="actions">
  <a href="projects/some-project/edit">
    <img src="images/edit-project.png" alt="Edit project" />
  </a>
  <a href="projects/some-project/do-something">
    <img src="images/someaction.png" alt="Do something else with the project" />
  </a>
</td>
Run Code Online (Sandbox Code Playgroud)

图像是透明的png.每张桌子的按钮数量可能会有所不同,现在总共大约有30个.

我被要求在应用程序css样式中进行更改,因此不同的表现在可以有不同的颜色,例如,customers表现在有一些粗糙的色调,项目一个是蓝色等等.而且,"奇数"表格行的颜色与"偶数"表格略有不同.如果选择它们,行也会更改颜色.

问题是该设计指出按钮必须随行改变颜色.这需要制作许多按钮 - 颜色组合,并且将来会添加更多按钮.

我认为比分配设计师制作不同颜色的数百个按钮版本更好的方法是动态制作,具体取决于表类.我的问题是 - 最有效的方法是什么?该应用程序使用PHP作为服务器端语言和javascript与客户端jQuery.图像的问题是它们不是单色而是使用多种颜色,因此我必须根据css类操作它们的HSL.

如果使用php更好的方法,我可能会使用ImageMagick.问题是获取与所提供颜色非常接近的图像的最佳方法是什么.

javascript css php jquery image-processing

5
推荐指数
1
解决办法
7555
查看次数

CSS可用于着色灰度图标吗?

我的webapp上有一些图标是灰色的,背景是透明的.

是否可以通过CSS为这样的图像添加色调?我会想到让我玩饱和度和图像或元素色调的东西.

如果它不存在,是否正在讨论未来的CSS版本?

这是我想要的颜色图像:http://www.clker.com/clipart-transparent-arrow.html

这不是我想要做的:jQuery:有一种方法可以将颜色(色调)应用到图像中吗?

一种解决方法是使用JavaScript http://www.pixastic.com/lib/

css css3

5
推荐指数
1
解决办法
4759
查看次数

如何使用jQuery对PNG图像进行着色,跨浏览器

我试着像这个问题一样做,但更基本:我有一个只有白色和透明颜色的PNG图像.我需要在给定的RGB十六进制值中着色白色部分,而不触摸透明部分.

我想用jQuery插件做这个.有没有可以做到这一点?

它必须在所有主要浏览器(IE,FF,GC,Safari)的最新版本中工作,还有较低版本支持的奖励积分.


用法示例

在此输入图像描述 在此输入图像描述 在此输入图像描述


我发现/想到的事情:

  • 像素,但没有交叉支持
  • CamanJS,但这不适用于jQuery
  • 这里的另一个div覆盖,但这会损害透明部分
  • 使白色部分透明,反之亦然,然后使用背景颜色 - 但图像由用户上传,这不会使其更加用户友好

javascript jquery png colorize jquery-plugins

5
推荐指数
1
解决办法
4390
查看次数

如何在PHP中为透明PNG文件着色?

我有一个透明的PNG图像.透明区域需要保持完全透明,但其他区域需要具有特定色调的着色.

使用GD做到这一点的最佳方法是什么?

干杯,
詹姆斯

php png transparency gd png-24

3
推荐指数
1
解决办法
3182
查看次数

图像高度始终返回0

我试图按照这个 SO答案来解决如何为图像着色,但是当我这样做时,$("#myselector").height();保持被归还为0.我做错了什么?继承我的代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Test</title>
    <link rel="stylesheet" href="style.css">
    <!--[if IE]>
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
</head>
<script src="http://codeorigin.jquery.com/jquery-1.10.2.min.js"></script>

<script>
$(document).ready(function() {
  overlay = $("#overlay");
img = $("#myimg");
overlay.width($("#myimg").width());
alert($("#myimg").height());
overlay.height("100");
overlay.css("top", img.offset().top + "px");
overlay.css("left", img.offset().left + "px");

});


</script>

<body id="home">

<div id="overlay" class="overlay"></div>
<img id="myimg" src="building.png" />

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

javascript jquery

3
推荐指数
1
解决办法
2278
查看次数

鼠标悬停更改图像颜色

我有一个很大的图像网格.当用户将鼠标悬停在图像上时,我希望图像着色为蓝色0000FF.有没有办法在JS或jquery中执行此操作?理想情况下,我不必为每个图像应用一个类.此处理应影响屏幕上的所有图像.

在这里和其他地方搜索论坛后,我了解到有些人在图像上使用了一个有颜色和不透明度的div,但我如何将它应用于所有img?

我一直看到的另一件事是paintbrushJS和pixastic,但我不知道如何使这些工作为此目的.

这是我正在处理的页面:http: //www.rollinleonard.com/elements/

编辑:图像需要是可点击的,因此div不能阻止链接的img.有没有办法点击div或将div放在下面或什么?提供的一些解决方案不使用div但我无法弄明白.

谢谢!罗林

javascript jquery mouseover

2
推荐指数
1
解决办法
9925
查看次数