ScrollView - image download - hold press does not work?

6 posts, 0 answers
  1. Antonio
    Antonio avatar
    15 posts
    Member since:
    Oct 2012

    Posted 14 Dec 2012 Link to this post

    Hi,

    I viewed your sample http://demos.kendoui.com/mobile/scrollview/index.html on my iPhone. I tried to save one of the images by doing a hold press and it does not show the "Save Image" sheet in safari. Normally when you browse a website and you want to save an image to your local photo album, you just do a hold press on the image and after a few seconds the "Save Image" action sheet comes up. 

    How can I do the same with the ScrollView?

    Best regards,
    Antonio
  2. Antonio
    Antonio avatar
    15 posts
    Member since:
    Oct 2012

    Posted 14 Dec 2012 Link to this post

    Is there any way I can enable that "Save Image" in the scrollView? What is the alternative? JavaScript? jQuery?
  3. Kendo UI is VS 2017 Ready
  4. Antonio
    Antonio avatar
    15 posts
    Member since:
    Oct 2012

    Posted 15 Dec 2012 Link to this post

    OK, so this is what I found out. When you put an image within a scrollView, you will not be able to bring up the context menu "Save Image Sheet" when you tap-and-hold the image. But to enable this, you'll have to set the CSS property "-webkit-touch-callout" to "default".

    <div data-role="scrollview" id="scrollview" data-change="onChange">                                
    <div data-role="page">
    <img src="/images/conversation/yournickname2.png" class="shareble_image" id="yournickname" style="-webkit-touch-callout:default;" />
    </div>
    </div>


    I wonder if there is another method to do this. Is there a JavaScript routine to bring up the context menu? The above works when you tap-and-hold the image. But what if I want to have a "download" button and when the user taps on that button, it brings up the context menu so they can download the image. Is there a way to do this in JavaScript? Or can you simulate a tap-and-hold via JavaScript?



  5. Petyo
    Admin
    Petyo avatar
    2438 posts

    Posted 18 Dec 2012 Link to this post

    Hi,

    The webkit touch callout is set to 'none' for Kendo UI Mobile - since we provide the means of handling tap and hold events. As you have correctly observed, restoring it for a certain element brings the context menu back. 

    I am not sure if the dialog can be triggered with javascript - but you may consider looking through the jQuery documentation for DOM event triggering. 

    All the best,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Antonio
    Antonio avatar
    15 posts
    Member since:
    Oct 2012

    Posted 18 Dec 2012 Link to this post

    Hi Petyo,

    I just tested this on various devices. setting "-webkit-touch-callout" to "default" works for iOS and Samsung Android devices. However, it does not work for HTC One X.

    Do you know why or what is the fix? I am using Q2 release.

    Best regards,
    Antonio
  7. Petyo
    Admin
    Petyo avatar
    2438 posts

    Posted 19 Dec 2012 Link to this post

    Hi Antonio,

    I responded in your support ticket - we can't reproduce the problem you describe. I would like to mention that it seems to be iOS specific property.

    Regards,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
Kendo UI is VS 2017 Ready