Font Name dropdown on Zoom

6 posts, 1 answers
  1. Chris Poirier
    Chris Poirier avatar
    14 posts
    Member since:
    Mar 2007

    Posted 04 Jan Link to this post

    Hi,

        When the fonts dropdown is visible and then zoom the page, its doesn't align properly. https://demos.telerik.com/aspnet-ajax/editor/examples/overview/defaultcs.aspx

    Will it be possible to keep it under under the controls that triggered it.

    Thanks,

    Lakpa

  2. Answer
    Rumen
    Admin
    Rumen avatar
    14324 posts

    Posted 06 Jan Link to this post

    Hi Lakpa,

    Thank you for reporting this annoying behavior of the editor dropdowns in the live demos app.

    I wasn't able to reproduce it on a blank page, but only in the demo app.

    Nevertheless, you can easily fix it with the help of the following JavaScript code:

    <telerik:RadEditor  id="RadEditor1" runat="server"></telerik:RadEditor>
    <script>
        window.onresize = function (ev) {
            if (ev.type == "resize" && $telerik.$(".reDropDownBody:visible")[0] && $telerik.$(".reDropDownBody:visible")[0].PopupBehavior && $telerik.$(".reDropDownBody:visible")[0].PopupBehavior.get_parentElement()) {
                var dropdown = $telerik.$(".reDropDownBody:visible")[0].PopupBehavior.get_parentElement().control;
                dropdown.hide();
                dropdown.show();
            }
        }
    </script>

     

    Regards,
    Rumen
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Chris Poirier
    Chris Poirier avatar
    14 posts
    Member since:
    Mar 2007

    Posted 07 Jan in reply to Rumen Link to this post

    Hi Rumen,

       On resize, at some zoom level  the dropdownBody isn't aligned properly. Please see the attached image. Tested on Chrome.

      

  4. Rumen
    Admin
    Rumen avatar
    14324 posts

    Posted 08 Jan Link to this post

    Thank you for the screenshot!

    The provided code works properly with the live demos of RadEditor.

    Can you please isolate the issue in a simple aspx page and send the page contents so that I can reproduce it?

    The problem is due to some CSS styling and the position of RadEditor on the page. Once I am able to reproduce it I will be able to research it further.

     

    Regards,
    Rumen
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  5. Chris Poirier
    Chris Poirier avatar
    14 posts
    Member since:
    Mar 2007

    Posted 08 Jan Link to this post

    When I created a demo project with just RadEditor then on zoom it seems to be working fine. It doesn't even require windows resize function. Seems like the problem is on our side.

    Thank you.

  6. Rumen
    Admin
    Rumen avatar
    14324 posts

    Posted 09 Jan Link to this post

    It is something related to the positioning of the editor on the page. Look for position: absolute, top, left properties in the CSS or other CSS properties. You can start to exclude the CSS classes and inline styles one by one from the page to see which one is causing the trouble.

     

    Regards,
    Rumen
    Progress Telerik

    Get quickly onboarded and successful with UI for ASP.NET AJAX with the Virtual Classroom technical trainings, available to all active customers. Learn More.
Back to Top