jQuery wrap breaks CSS псевдоэлементы

Question

Хорошо, что для сайта, над которым я работаю, я создаю эти кучи изображений. Я пытаюсь сделать так, чтобы я мог просто захватить <img>, а затем обернуть его с помощью div и настроить css, чтобы он ухаживал за ним, чтобы придать ему эффект кучи изображения.

Вот ссылка на fiddle. И вот основная часть кода.

(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 элемента.

Просто попробуйте установить left или right атрибут для :before и :after в вашем CSS.

Fiddle: http://jsfiddle.net/39HKr/6/