As per the title - does something in Kendo/Kendo mobile change the meta viewport tag? I'm asking because on the device using PhoneGap / Cordova it is broken for retina resolutions - everything looks zoomed in. i have tried adding the EnableViewportScale to the plist - and setting the viewport tag as per StackOverflow ( http://stackoverflow.com/questions/7612330/phonegap-and-retina-display ) but it doesn't seem to work with Kendo Mobile - but looks fine in Chrome with a fake userAgent :)
3 Answers, 1 is accepted
0
S
Top achievements
Rank 1
Rank 1
answered on 07 Jan 2013, 03:42 AM
Ok - learning this as I go - I'm an old-school coder, but new to web development :)
I see in chrome debug tools that something is adding another viewport tag. I don't think it's the cordova stuff since their samples make me put it in by hand. It's not the Edge Animate test either - the extra tag is there even with that removed.
It appears to be added by Kendo Mobile (kendo.mobile.js - the viewportTemplate property) even though I already had one in my document. Maybe the lib should check if I have one or not before adding it? Please see the attached screen shot from chrome debug window. The highlighted tag is "mine". I put the incorrect attribute "original" in the tag from my source to show that it is the original. And different from the 2nd <meta> tag. The extra added one is 3 lines above it with the name/content "backwards". I can fix this by editing the kendo.mobile.js file and changing the template but I'm not sure enough on my JS feet yet to make sure I'm not doing something wrong :)
Thanks,
Stephen
I see in chrome debug tools that something is adding another viewport tag. I don't think it's the cordova stuff since their samples make me put it in by hand. It's not the Edge Animate test either - the extra tag is there even with that removed.
It appears to be added by Kendo Mobile (kendo.mobile.js - the viewportTemplate property) even though I already had one in my document. Maybe the lib should check if I have one or not before adding it? Please see the attached screen shot from chrome debug window. The highlighted tag is "mine". I put the incorrect attribute "original" in the tag from my source to show that it is the original. And different from the 2nd <meta> tag. The extra added one is 3 lines above it with the name/content "backwards". I can fix this by editing the kendo.mobile.js file and changing the template but I'm not sure enough on my JS feet yet to make sure I'm not doing something wrong :)
Thanks,
Stephen
0
Accepted
Hello,
Yes, Kendo UI Mobile does add a viewport meta tag to the document, as it depends on several of its settings, like limiting the scale to 1.0 as the Widget sizes are intended to be used at that scale. It doesn't check if there is one, as settings as width and height will probably break the layout and thus it tries to override them. If you still want to change the viewport tag, please do so after Application init by either editing the old one or adding a completely new meta tag, however you may experience application misbehavior due to that.
Regards,
Kamen Bundev
the Telerik team
Yes, Kendo UI Mobile does add a viewport meta tag to the document, as it depends on several of its settings, like limiting the scale to 1.0 as the Widget sizes are intended to be used at that scale. It doesn't check if there is one, as settings as width and height will probably break the layout and thus it tries to override them. If you still want to change the viewport tag, please do so after Application init by either editing the old one or adding a completely new meta tag, however you may experience application misbehavior due to that.
Regards,
Kamen Bundev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
S
Top achievements
Rank 1
Rank 1
answered on 07 Jan 2013, 06:29 PM
Thanks for the update - my core problem here actually turned out to be a PhoneGap issue. The 2.3 release seems to make everything work "correctly" again :)
Thanks!
Thanks!