[英]How to override inline css style property which added by jquery
我正在使用 Kendo UI 选项卡,因此一旦选项卡到达最后一个 li 列表,右导航箭头就会被隐藏或添加 display none inline CSS 和 jquery 所以我想覆盖显示 none 以显示 block.important 并在 div 显示时添加不透明度 0.4没有财产。
https://dojo.telerik.com/@vishal14/UcaPEYoh
我尝试使用 if 语句,但它不起作用
<script>
$(document).ready(function () {
$("#tabstrip").kendoTabStrip();
if($('.k-button').is(':visible')){
$(this).css("opacity","0.2");
}else{
$(this).css("opacity","1");
}
});
</script>
您的代码if($('.k-button').is(':visible'))
不起作用,因为左右按钮是动态添加的。
对于右键,请尝试以下代码:
$(document).ready(function () {
$("#tabstrip").kendoTabStrip();
setInterval(function () {
var el = $('.k-tabstrip-next');
if (el.css('display') == 'none') {
el.css("opacity", "0.2").css('display', '');
el.attr('data-el', 'stop');
}
else if (el.attr('data-el') != 'stop')
el.css("opacity", "1");
}, 200);
$(document).on('click', '.k-tabstrip-prev', function () {
$('.k-tabstrip-next').attr('data-el', '');
});
});
如果你想让两个按钮都可见,你可以试试这个:
$(document).ready(function () {
$("#tabstrip").kendoTabStrip();
setInterval(function () {
var ne = $('.k-tabstrip-next');
var pr = $('.k-tabstrip-prev');
if (ne.css('display') == 'none') {
ne.css("opacity", "0.2").css('display', '');
ne.attr('data-el', 'stop');
}
else if (ne.attr('data-el') != 'stop')
ne.css("opacity", "1");
if (pr.css('display') == 'none') {
pr.css("opacity", "0.2").css('display', '');
pr.attr('data-el', 'stop');
}
else if (pr.attr('data-el') != 'stop')
pr.css("opacity", "1");
}, 200);
$(document).on('click', '.k-tabstrip-prev', function () {
$('.k-tabstrip-next').attr('data-el', '');
});
$(document).on('click', '.k-tabstrip-next', function () {
$('.k-tabstrip-prev').attr('data-el', '');
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.