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
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
12 Answers, 1 is accepted
0
Hi Johnathan,
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
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"> <html xmlns="http://www.w3.org/1999/xhtml"> <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.
0
Johnathan
Top achievements
Rank 1
Rank 1
answered on 12 Jan 2011, 11:34 AM
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
Thanks
Johnathan
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"> <html xmlns="http://www.w3.org/1999/xhtml"> <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
0
Johnathan
Top achievements
Rank 1
Rank 1
answered on 16 Jan 2011, 11:26 PM
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
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
0
Hi Johnathan,
Svetlina
the Telerik team
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.
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.
0
Johnathan
Top achievements
Rank 1
Rank 1
answered on 17 Jan 2011, 03:46 PM
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?
Are you testing this on an ipad directly or using an emulator?
0
Johnathan
Top achievements
Rank 1
Rank 1
answered on 17 Jan 2011, 04:56 PM
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.
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.
0
Hello Johnathan,
Svetlina
the Telerik team
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.
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.
0
Johnathan
Top achievements
Rank 1
Rank 1
answered on 20 Jan 2011, 07:37 PM
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
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
0
Hi Johnathan,
Svetlina
the Telerik team
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.
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.
0
Johnathan
Top achievements
Rank 1
Rank 1
answered on 25 Jan 2011, 05:50 PM
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 :)
I'll send my video capture to Steve Jobs to see if he wants to use it in the next Ipad commercial :)
0
Travis Johnson
Top achievements
Rank 1
Rank 1
answered on 18 Feb 2011, 07:34 PM
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
Did the internal build fix the same issue with radmenu also?
Thanks Trav
0
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
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!