Hi,
I have a kendo mobile view with lot of content.One has to scroll to go to the bottom of the view.I have a div(locatemap) with google maps.For some reason, whenever I pan up or down or zoom in the map by touching and moving on the device, it causes the entire ​view to scroll up or down. I have used data-stretch="true" still it is not working.
Below is the code:-
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div data-role="view" id="locatemyzyptagview" data-layout="mobile-tabstrip" data-align="center" data-reload="true"
data-model="APP.models.locatemyzyptag" data-init="locateExistingTag_init" data-show="locateExistingTag_show" data-stretch="true">
<div id="locateTagScroller" data-role="scroller" style="width: 100%;">
<div data-role="content" id="MainContentDiv">
<div class="tag-details-fav">
<img id="heartid" class="img-top" src="styles/images/favsmallheart.png" />
</div>
<div id="myzyptahtxtbox" class="tag-details font-size-22">
</div>
<div id="desctxtarea" class="tag-description font-size-14">
</div>
<div id="locatemap" class="tag-map">
</div>
<div id="locatemapicons" class="tag-map-icons">
<a id="editicon" class="edit_icon" data-role="button" data-click="editiconfunc">
<img src="styles/images/editiconred.png" /></a><br />
<a id="directionicon" data-role="button" data-click="ShowDirections">
<img src="styles/images/getdiricon.png" /></a><br />
<a id="favicon" class="fav_icon" data-role="button" data-click="addtofav">
<img src="styles/images/addfavicon.png" /></a>
</div>
<div id="tagIcons" class="tag-icons">
<center>
<a data-role="button" data-click="ShareViaFb">
<img src="styles/images/socialmedia/facebook.png" /></a> <a data-role="button" data-click="ShareViaGmail">
<img src="styles/images/socialmedia/google.png" /></a> <a data-role="button" data-click="ShareViaTwitter">
<img src="styles/images/socialmedia/twitter.png" /></a> <a data-role="button" data-click="ShareViaWhatsapp">
<img src="styles/images/socialmedia/whatsapp.png" /></a> <a data-role="button" data-click="ShareViaSms">
<img src="styles/images/socialmedia/sms.png" /></a> <a data-role="button" data-click="ShareViaEmail">
<img src="styles/images/socialmedia/mail.png" /></a> <a data-role="button" data-click="Copylink">
<img src="styles/images/socialmedia/link.png" /></a>
</center>
</div>
<div id="tagPhotoLabel" class="tag-label" style="display:none;">
PHOTO
</div>
<div>
<center>
<img src="" id="myImgSearchExisting" class="resimgs" style="display:none;padding-top:6px;" data-role="touch" data-doubletap="myTouch.doubletap"/>
</center>
</div>
<div id="tagAddressLabel" class="tag-label">
ADDRESS
</div>
<div id="addresstxtarea" class="tag-add">
</div>
<div id="tagNotesLabel" class="tag-label">
NOTES
</div>
<div id="notestxtarea" class="tag-notes">
</div>
</div>
</div>
</body>
</html>
How can I solve this issue?
Thanks,
Ruchin Dayal.