JavaScript:使用 marginLeft 在图像上定位评级星
JavaScript: Using marginLeft to position rating stars over image
我正在使用 JavaScript 插件为评论应用星级。这个 [fiddle] 有大部分代码。星星出现在下拉列表的位置(外部资源未加载以在 fiddle 中显示)。星星在本地主机上显示良好,但我想将星星定位在中间的某个位置(或者可能在图像本身的任何位置)。
为此,我正在使用:
$(function() {
var _elm=document.getElementById('example2');
_elm.style.marginLeft = "150px";
$('#example2').barrating({
theme: 'fontawesome-stars',
readonly: true,
initialRating: 3
});
});
但是星星不会改变它们的位置。那我该如何定位星星呢?
对于完成,没有控制台错误。
插件正在将示例 2 select 设置为 display:none,
所以对它的任何更改都不会有用。
你应该把你的 css 直接苹果到
.br-theme-fontawesome-stars .br-widget
例如你可以给它
margin-left:20px;
margin-top:-50px;
但是它会在图片下面,所以你可以给它z-index
z-index:100;
然后你会看到箭头上的变化。
最终结果将是:
.br-theme-fontawesome-stars .br-widget {
height: 28px;
white-space: nowrap;
margin-left:20px;
margin-top:-50px;
z-index:100;
}
fiddle - https://jsfiddle.net/omwpz0tw/12/
我正在使用 JavaScript 插件为评论应用星级。这个 [fiddle] 有大部分代码。星星出现在下拉列表的位置(外部资源未加载以在 fiddle 中显示)。星星在本地主机上显示良好,但我想将星星定位在中间的某个位置(或者可能在图像本身的任何位置)。
为此,我正在使用:
$(function() {
var _elm=document.getElementById('example2');
_elm.style.marginLeft = "150px";
$('#example2').barrating({
theme: 'fontawesome-stars',
readonly: true,
initialRating: 3
});
});
但是星星不会改变它们的位置。那我该如何定位星星呢? 对于完成,没有控制台错误。
插件正在将示例 2 select 设置为 display:none, 所以对它的任何更改都不会有用。
你应该把你的 css 直接苹果到
.br-theme-fontawesome-stars .br-widget
例如你可以给它
margin-left:20px;
margin-top:-50px;
但是它会在图片下面,所以你可以给它z-index
z-index:100;
然后你会看到箭头上的变化。
最终结果将是:
.br-theme-fontawesome-stars .br-widget {
height: 28px;
white-space: nowrap;
margin-left:20px;
margin-top:-50px;
z-index:100;
}
fiddle - https://jsfiddle.net/omwpz0tw/12/