我正在尝试自定义Angular UI Bootstrap Carousel并将SVG图像作为背景应用于左右旋转木马控制箭头锚点。
HTML：
$(document).ready(function() {
$('input[type=radio][name=expiry]').change(function() {
var d = this.value;
var myDate=new Date($("#date1").val());
myDate.setDate(myDate.getDate()+parseInt(d));
var inputDate = (myDate.getMonth()+1)+'/'+(myDate.getDate())+'/'+(myDate.getFullYear());
$("#date2").val(inputDate);
});});
CSS：
<a class="left carousel-control" ng-click="prev()" ng-show="slides.length > 1">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
是否是 /*pulling control anchor outside the carousel body*/
.carousel-control.left {
left: -15%;
}
.carousel-control.right, .carousel-control.left {
-webkit-filter: none;
filter: none;
z-index: 5;
}
/*Default carousel code from Bootstrap.css*/
.carousel-control.left {
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
}
.carousel-control {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 15%;
opacity: 0.5;
filter: alpha(opacity=50);
font-size: 20px;
color: #fff;
text-align: center;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
/*pulling control anchor outside the carousel body*/
.carousel-control.right {
right: -15%;
}
a.left.carousel-control > span.glyphicon.glyphicon-chevron-left {
background: url("/assets/images/arrowLeft.svg") center center;
}
a.right.carousel-control > span.glyphicon.glyphicon-chevron-right {
background: url("/assets/images/arrowRight.svg") center center;
}
/*Disabling default background font-icon*/
a.right.carousel-control > span.glyphicon.glyphicon-chevron-right::before, a.left.carousel-control > span.glyphicon.glyphicon-chevron-left::before {
content: '' !important;
display: block;
overflow: visible;
height: 30px;
width: 30px;
}
的双重使用造成的？我尝试将background-image更改为无，但这也不起作用！ TIA！
答案 0 :(得分：0)
没关系，我给了一个溢出物：隐藏在旋转木马上！不管怎样，谢谢！