我正在尝试更改 div 内透明图像的颜色(使用 jQuery)。在更改颜色时，我无法将图像的左侧和顶部固定到 div 中。
有人能帮忙吗？如果用户点击任何跨度颜色，我会尝试填充图像。
测试.css:
.iconWrapper .color span
{
width: 50px;
height: 58px;
display: block;
}
.color1
{
background-color: #f6f6f6;
}
.color2
{
background-color: #ffe25b;
}
.color3
{
background-color: #e35990;
}
.color4
{
background-color: #58c1d8;
}
step1.php
<link rel="stylesheet" type="text/css" href="test.css" media="screen" />
<script language="javascript" type="text/javascript">
$(function() {
$('.iconWrapper span').click(function(e){
var color=$(this).attr('class');
//alert(color);
$('#div1').removeClass().addClass(color);
$('#hiddencolor').val(color);
e.preventDefault();
});
});
</script>
</head>
<body>
<div class="iconWrapper">
<ul class="color">
<li>
<a href="#" title="Selecteer"><span class="color1"></span></a>
</li>
<li>
<a href="#" title="Selecteer "><span class="color2" ></span></a>
</li>
<li>
<a href="#" title="Selecteer"><span class="color3"></span></a>
</li>
<li>
<a href="#" title="Selecteer"><span class="color4"></span></a>
</li>
</ul>
</div>
<div id="div1" style="width:17%; height:28%;" ><img src="img/107.png" />
<form method="post" action="step3.php">
<input name="kleur" type="text" value="" id="hiddencolor" />
<input name="submit" type="submit" value="Submit" />
</form>
</div>
最佳答案
将父 div 的宽度从 17% 更改为 img 的 width，换句话说 250px
关于javascript - div 宽度和高度不适合图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6693857/