jQuery wrap打破了CSS伪元素

Question

好吧，对于我正在研究的网站，我正在创建这些图像堆。 我试图这样，我可以抓住一个<img>然后用一个div包装它并让我设置的css照顾它的样式给它图像堆效果。

这是一个小提琴的链接。 这是代码的主要部分。

(function ($){
    $.fn.ImagePile = function (options) {
        var settings = $.extend({
            pileType: "neat"
        }, options);
        //get pileType from settings
        var pileType = settings.pileType;

        switch(pileType){
            case "neat":
                return this.wrap("<div class='stack neat'></div>");
                break;
        }
    };
})(jQuery);


$("#image1").ImagePile();

忘记提到问题是:after元素没有出现在它应该出现的地方之后。

Answer 1

如果你没有为绝对定位的项设置left或right属性，那么它默认为auto ，这对于:before元素很好，但显然不是:after元素。

只需尝试为CSS中的:before和:after设置left或right属性。

小提琴： http ： //jsfiddle.net/39HKr/6/