我正在使用光滑的滑块，但是无论出于什么原因，当我将鼠标移到next或previous按钮上时，它都不会改变不透明度（鼠标移出：0.5，鼠标移入：1），并且保持不变1，有没有办法可以应用jQuery来更改此任务的CSS？我要添加jQuery的元素如下所示：
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
opacity: 1;
}
.slick-prev:before,
.slick-prev:before,
.slick-next:before,
.slick-next:before
{
opacity: 0.5;
}
(function($) {
jQuery.fn.extend({
// get pseudo property
getPseudo: function(pseudo, prop) {
var props = window.getComputedStyle(
$(this).get(0), pseudo
).getPropertyValue(prop);
return String(props);
},
// set pseudo property
setPseudo: function(_pseudo, _prop, newprop) {
var elem = $(this);
var s = $("style"); // existing `style` element
var p = elem.getPseudo(_pseudo, _prop); // call `getPseudo`
var r = p !== "" ? new RegExp(p) : false;
var selector = $.map(elem, function(val, key) {
return [val.tagName
, val.id
? "#" + val.id : null
, val.className ? "." + val.className : null]
});
var _setProp = "\n" + selector.join("")
.toLowerCase()
.concat(_pseudo)
.concat("{")
.concat(_prop + ":")
.concat(newprop + ";}"); // css semicolon
return ((!!r ? r.test($(s).text()) : r)
? $(s).text(function(index, prop) {
return prop.replace(r, newprop)
})
: $(s).append(_setProp)
);
}
})
})(jQuery);
$(".show-more-after").on("click", function() {
var toggle = $(this).getPseudo(":after", "opacity");
$(this).setPseudo(":after", "opacity", toggle === "0.5" ? "1" : "0.5");
}).show-more-after:after {
content: " abc";
opacity : 0.5;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div class="show-more-after">click</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句