createFakeParserElement in inline-editor

I have made a plugin for creating slideshows on my website.
I am finally come to the point where I can create a new slideshow and show it as a fake image in the texteditor.

In my classic editor the fake image is showing before and after resfresh.

Unfortunately the fake image only shows just after inserting the slideshow ind the inline editor. As soon as I refresh nothing is showing, also if the html still is intact.

Is there special work out for inline editing and fake image? I have googled for 2 days now, but I dont find solution.

this is my plugin:

CKEDITOR.plugins.add( 'di_slideshow',
{
	requires : ['iframedialog','fakeobjects'],

	init: function( editor )
	{
		
        var iframeWindow = null;
		editor.addCommand( 'di_slideshowDialog', new CKEDITOR.dialogCommand( 'di_slideshowDialog', {
                                                                            allowedContent: 'di_slideshow[type,album]',
                                                                            requiredContent: 'di_slideshow'
                                                                           } ) );
		editor.ui.addButton( 'di_slideshow',
		{
			label: 'Slideshow',
			command: 'di_slideshowDialog',
			icon: this.path + 'images/icon.png'
		});
		      var cmd = editor.addCommand('di_slideshow.cmd', {exec:showDialogPlugin});
              var me = this;
			  CKEDITOR.dialog.add( 'di_slideshowDialog', function ()
               {              
				 return {
                 title : 'Slideshow',
                 minWidth : 500,
                 minHeight : 500,
                 contents :
                       [
                          {
                             id : 'iframe',
                             label : 'Insert slideshow',
                             expand : true,
                             elements :
                                   [
                                      {
                                         type : 'iframe',
                                         src : me.path + 'di_dialog.aspx',
										 requiredContent: 'di_slideshow[type,album]', // Attributes must be allowed to enable this field.
                                         width : 500,
                                         height : 500,
                                         onContentLoad : function() {
                                            var iframe = document.getElementById( this._.frameId ); 
                                            iframeWindow = iframe.contentWindow;
                                         }
                                      }
                                   ]
                          }
                       ],
                 onOk : function()
				 {
				   this._.editor.insertHtml(iframeWindow.document.getElementById('hfEditor').value);
				   
				   var slideshowNode;
                   slideshowNode = new CKEDITOR.dom.element('di_slideshow');
                   var newFakeImage = editor.createFakeElement(slideshowNode, 'di_slideshow', 'iframe', true);
                   editor.insertElement(newFakeImage);			   
				   
				   
				}
		     }
		  }
			
         );	
		 		 	
	},
		
		
		afterInit : function( editor )
		{
		   var dataProcessor = editor.dataProcessor,
			  dataFilter = dataProcessor && dataProcessor.dataFilter;
		
		   if ( dataFilter )
		   {
			  //Here we want to add a new filter rule...if the source matches this property, it will be converted
			  dataFilter.addRules(
				 {
					elements :
					{


                        'di_slideshow' : function( element )
                            {
							   var slideshowNode;
                               slideshowNode = new CKEDITOR.dom.element('di_slideshow');
                               var e = editor.createFakeParserElement( element, 'di_slideshow', 'di_slideshow', true );
							   e.attributes["style"] = 'background-image: url(' + '/ckeditor/plugins/di_slideshow/images/slideshow_fakeimage.png' + ');' +
														'background-position: center center;' +
														'background-repeat: no-repeat;' +
														'width: 100%;' +
														'height: auto;'; 
                               return e;
                            }

					}
				 },
				 3); 
		   }
		}	
			
		
		
		
		
	});

function showDialogPlugin(e){
   e.openDialog('di_slideshowDialog');
}



function createFakeElement( editor, realElement )
   {
      var fakeElement = editor.createFakeParserElement( realElement, 'di_slideshow', 'di_slideshow', true );
      return fakeElement;
   }