Issue with Ipad

13 posts, 0 answers
  1. Johnathan
    Johnathan avatar
    18 posts
    Member since:
    Aug 2010

    Posted 06 Jan 2011 Link to this post

    Hi

    I know you don't support the ipad, but i am trying to make a web application that is ipad browser friendly. The tooltip control is perfect for creating small menu  which when the user clicks (rather than hovers) produces a menu very similar to the built in control of the ipad.
    It works perfectly in all areas except one.

    At 100% zoom levels on the ipad when you tap/click the parent control the tooltip appears correctly positioned. However if you zoom in the browser  above 100% then the tooltip appears far away from where you have tapped / clicked
    I have the positioning set to  relative to the mouse pointer.

    I know that you don't support the ipad, but its clear that this touch screen browsing is going to be a big part of the future and it would be great if you could look at this small issue in your future realeases as this control works very well ont he ipad other than this.

    thanks

    Johnathan
  2. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 11 Jan 2011 Link to this post

    Hi Johnathan,

     What you report sounds probable in case of scrollbars due to some problems with the scroll calculations under iPad. However, we fixed those issues in our latest release and thus what I can suggest is the following:

    1) Make sure that you are using the latest version of RadControls (you can also test with the latest internal build as well)

    2) If this does not help, please test the following code which I tested on my side:

    <%@ Page Language="C#" %>
      
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="RadScriptManager1" runat="server">
        </asp:ScriptManager>
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <div style="height:30px; width:3000px;"></div>
        <asp:Label ID="Label1" runat="server" Text="Test Target Control"></asp:Label>
        <telerik:RadToolTip ID="RadToolTip1" runat="server" RelativeTo="Mouse" TargetControlID="Label1"
            Position="MiddleRight" Width="100" Height="100">
        </telerik:RadToolTip>
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        </form>
    </body>
    </html>

    I zoomed the browser under iPad with it but the result was the same before and after the zoom. In case you reproduce the problem with this code and the latest version, please send us a video capture of the reproduction steps. In case the code should be modified, share a fully runnable modified page along with detailed reproduction steps. Once we are able to observe the issue locally we will do our best to help.

    Kind regards,
    Svetlina
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Johnathan
    Johnathan avatar
    18 posts
    Member since:
    Aug 2010

    Posted 12 Jan 2011 Link to this post

    Hi

    I followed the steps you suggested. I am running verson 2010.3.1215.40 which I beleive is the latest version.

    I created the test page (below), then viewed it on the ipad. The results are the same, at 100% zoom the positioning of the tooltip is correct but at greater zoom levels the positioning is wrong. FYI I looked at some the Radmenu (which I guess is similar) control and the menu appears correctly position at all zoom levels on the ipad.
    here are some screenshots:
    1. Tap the label at 100% zoom and the tooltip appears correctly http://screencast.com/t/yXZKnrteXPD
    2. Pinch zoom in a little and then click/ tap the label and it appears in the wrong place http://screencast.com/t/RLgUPCsNiz


    <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="testingPage.aspx.vb" Inherits="KPIDash.testingPage" %>
      
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
      
      
      
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
          
        <div style="height:30px; width:3000px;"></div
        <asp:Label ID="Label1" runat="server" Text="Test Target Control"></asp:Label
        <telerik:RadToolTip ID="RadToolTip1" runat="server" RelativeTo="Mouse" TargetControlID="Label1" 
            Position="MiddleRight" Width="100" Height="100"
        </telerik:RadToolTip
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
        <br/> 
      
         </form>
    </body>
    </html>
        

    Thanks

    Johnathan
  5. Johnathan
    Johnathan avatar
    18 posts
    Member since:
    Aug 2010

    Posted 16 Jan 2011 Link to this post

    Something else I have noticed on the ipad.

    When the page loads and you allow a tooltip to appear (say on a onlick) it appears correctly positioned.
    However if you scroll down the screen a little then the tooltip appears not where the control is now, but where the control was when the page first loaded. I think this is the same behaviour after the zoom. 
    So on the ipad the position x,y of the tooltip appears relative to the screen or browser window and not the movable web page, thus as the page moves or zooms the tooltips appear alway in the same position on the screen and does not move with the scrolling page.

    Johnathan
  6. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 17 Jan 2011 Link to this post

    Hi Johnathan,

    I tested both the scenarios as follows:

    1) Show the tooltip; zoom the browser and show it again - it is shown as expected except for the case when it is repositioned due to browser boundaries detection.

    2) Shoe the tooltip; scroll the page and show the tooltip again - again, if there is enough place for the tooltip it is shown as expected.

     http://screencast.com/t/dLZ7itqnp

    Pleas,e let me know what I am doing wrong or send me a video capture of how you reproduce the problem shown on the screenshot in case there is enough place for the tooltip and we will do our best to help.

    Regards,
    Svetlina
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  7. Johnathan
    Johnathan avatar
    18 posts
    Member since:
    Aug 2010

    Posted 17 Jan 2011 Link to this post

    Thanks for looking at this again. I will double check it from my side on my ipad. 
    Are you testing this on an ipad directly or using an emulator?
  8. Johnathan
    Johnathan avatar
    18 posts
    Member since:
    Aug 2010

    Posted 17 Jan 2011 Link to this post

    This is an online link to the test page you sent me
    http://tinyurl.com/67uxwj2

    Ive tested this again on my ipad and it show the same incorrect position as earlier described.

    I'm using the latest ipday OS and the latest public realease of radcontrold.

    J.

  9. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 20 Jan 2011 Link to this post

    Hello Johnathan,

    I am using an emulator for the test and despite we have not encountered differences in behavior with it and with iPad, it is possible that there is such in your particular case.

    I tried to open the link you have sent but it seems to be broken. Would you please verify it and send the correct link? Once we are able to go through the exact reproduction steps, we will test again with both the emulator and iPad and we will let you know what are the results of our tests.

    Greetings,
    Svetlina
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  10. Johnathan
    Johnathan avatar
    18 posts
    Member since:
    Aug 2010

    Posted 20 Jan 2011 Link to this post

    Sorry, I moved the file with the link accidentally
     Try This http://tinyurl.com/6eqxncf

    The problem is very clear on the ipad and i have made a video so that you can see it. I now see why it does not show on an emulator browser because it only occurs when you are zoomed in on a tablet or you have scrolled the screen up or down.

    the tooltip position is alway correct when the page loads. - this is because the browser is at the top of the page. If you scroll down the page (which you can only do by zooming first as the ipad scales the window automatically on loading a page) then the tooltip always appears incorrectly as it is positioned relative to the top of the browser and not the top of the page.

    So as long as you are at the very top of a page, no matter what zoom level you pick the tooltip appears in the correct place because the top left corner of the page (top,left) = (0,0) and the browser window top left=(0,0).
    Once you scroll down the page, the top left of the page now has new coords, say (+100px,0) ie the page is scrolled down by 100px, however the tootip still appears position from a reference of (0,0) and not the new positioning reference of (100,0) thus the tooltip is 100px misaligned

    Watch this video. Its a bad version of a ipad commercial :)
    http://www.youtube.com/watch?v=jYS3jb8vd-U
  11. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 25 Jan 2011 Link to this post

    Hi Johnathan,

     Thank you very much for the provided additional explanations and video capture, we were finally able to reproduce the problem. I am glad to inform you that we were able to fix it and the fix will be available in the next internal build. Please, download it once it is available, test with it and let us know whether it fixed the problem on your side as well.

    Thank you once again for your kind cooperation, we updated your Telerik points.

    All the best,
    Svetlina
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  12. Johnathan
    Johnathan avatar
    18 posts
    Member since:
    Aug 2010

    Posted 25 Jan 2011 Link to this post

    Thank you for getting it sorted.

    I'll send my video capture to Steve Jobs to see if he wants to use it in the next Ipad commercial :)
  13. Travis Johnson
    Travis Johnson avatar
    13 posts
    Member since:
    Apr 2006

    Posted 18 Feb 2011 Link to this post

    I was having a similar issue with context menus. I fixed it by using showat() instead of assigning the menu to an element and then using show()

    Did the internal build fix the same issue with radmenu also?

    Thanks Trav
  14. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 23 Feb 2011 Link to this post

    Hi Travis,

    I wasn't able to reproduce your issue here. Can you send some sample markup of how are you showing the menu so I can be able to test it? Thank you in advance.

    Kind regards,
    Kamen Bundev
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017