I am having a bizarre problem that I don't even know how to troubleshoot. I have tried to recreate the problem in a jsfiddle but so far have been unsuccessful.
What happens is this: I'm loading a form into an overlay div that visually approximates a bootstrap modal (but it is not one.) When I have a CKEditor instance in the form, and I click on one of the dropdowns (i.e. Size, Styles, etc.) the whole screen will scroll down.
I know this is vague. I'm hoping someone can give me some insight into how ckeditor reponds to those events and how it might be interacting with my page. Anyone? :)
I've seen similar or even
I've seen similar or even identical issues before, but we fixed them few months ago. Do you use the latest version of CKEditor?
The issue is caused by Chrome scrolling window in order to show entire content of the dropdown even though it's not visible. The only solution we could find was to restore scroll position after moving focus to the dropdown.
Piotrek (Reinmar) Koszuliński
CKEditor JavaScript Developer
--
CKSource - http://cksource.com
--
Follow CKEditor on: Twitter | Facebook | Google+
Thanks for the reply.
Thanks for the reply.
I was using 4.1.2, now I'm using 4.3 because I saw references to what seemed like similar problems in your issue tracker, but I haven't noticed any improvment thus far. I thought it might be something related to CKEditor managing scroll position, and I'm wondering if the issue is when it stores scroll position. Could you possibly give me any insight into how that is managed? Could I be stepping on it somehow?
[edit: removed no longer relevant code to avoid confusion]
I will try to provide an example so you can at least see how I'm using it. In the meantime if you have any ideas I can try I'd appreciate it. If I have to change what I'm doing so be it.
Thanks,
Joel
FYI--I just upgraded CKE to 4
FYI--I just upgraded CKE to 4.3.1 and I'm still having the same issue in Chrome (Version 31.0.1650.63 m). It hadn't even occurred to me to try IE/Firefox, but I checked and I'm not seeing the problem in either of those browsers.
I started to think that
I started to think that perpahs this issue is caused by the modal windows you use. They often cause problems - e.g. we have few tickets for issues caused by jQUI. Did you try to reproduce it without the dialog?
Piotrek (Reinmar) Koszuliński
CKEditor JavaScript Developer
--
CKSource - http://cksource.com
--
Follow CKEditor on: Twitter | Facebook | Google+
I don't think it has to do
I don't think it has to do with the dialog per se--it's just a div after all--but it might have to do with how I position it. That's why I was wondering how CKE managed it's scroll position. You probably saw in the screen shots that I have a long list of content and my objective is to float the form over the content while maintaining scroll position. The div is position:absolute and z-index:100. Then I calculate the top margin of the div so it appears centered in the visible window.
If there are not enough records to cause a scroll bar to appear, there is never any problem. If a scroll bar is present, the problem occurs even if scroll position is 0 (scroll bar is present but I'm not scrolled down). So I gather that the problem is more related to the scroll bar (and how Chrome/CKE/My App respond to it) than the dialog. To further muddy the waters it doesn't happen every single time so perhaps there is a timing issue of some sort involved?
For the time being I've changed my logic to eliminate the scrollbar from the equation--I simply hide the list content while the form is displayed, which causes the scroll bar to disappear. Not as nice visually so I hope I don't have to leave it that way, but more predictable at least.
If I learn anything else I'll post it here.
Thanks.
I was thinking that you use
I was thinking that you use jQuery UI or similar libary for this dialog. Those libraries tend to do a lot more than just displaying a centered div - they try to control focus and perhaps some other things too. I suppose that they do that for better UX - e.g. they may need to prevent focus to be moved out from the dialog when navigating with tab. But hacks for that breaks CKEditor.
Anyway, it's not your case. On the other hand - I've got no idea what can be wrong - every time we have similar issue it means time spent on debugging. Fix for previous issues you can find here https://github.com/ckeditor/ckeditor-dev/blob/master/plugins/floatpanel/plugin.js#L370-L381 It's simple, but maybe it will help you.
Piotrek (Reinmar) Koszuliński
CKEditor JavaScript Developer
--
CKSource - http://cksource.com
--
Follow CKEditor on: Twitter | Facebook | Google+