[Laura LParticipant]

Hello,

Is there some code that would engage the Card Element flip/transition on mobile with just the first image tap? Right now (I have an iPhone 5S) it takes 2, and they have to be spaced apart so that the images don’t just magnify a bit, but rather do the flip. I’m hoping it can be more user-friendly in that way; right now it’s frustrating for the user who is trying to get more info on the image, to the point where they might give up on it altogether.

http://www.lauraletchingerart.com/available-work

UPDATE: Because of the issue I’m having with the card element animating smoothing on MacPro laptops, I’m just going to hold off on using that element for now and wait to see if things work better with the next upgrade. So the above “mobile issue” is not so important anymore. But maybe it’s something you guys could add to the request list.

Thank you,
Laura

[Rue NelModerator]

Hello There,

Thanks for writing in! It takes two taps before the card will flip. You can have on touch events by adding the following JS code in your customizer, Appearance > Customize > Custom > CSS as a temporary fix.

jQuery ( function($) {
 $(document).ready( function() {
  $('.x-card-outer').each(function(){
    var element = $(this);
    element.on('touchstart', function() {
      element.addClass('flipped');
    });
    element.on('touchend', function() {
      element.removeClass('flipped');
    });
  });
 });
});

This has already been reported to our developers. This fixed will be included in our next Cornerstone update release.

Please let us know how it goes.

[Laura LParticipant]

Thanks for the code. . .

When I put it in the Customizer CSS it didn’t do anything . . . I tried it in the Customizer Javascript, and it was attempting to do it, but was buggy. So I’m just going to wait and see how the card element works for me when the next update comes out since I’ve also got an issue with it animating smoothly on Macbook Pros.

Thanks!
Laura

[Rue NelModerator]

Hey Laura,

Yes, that maybe a good idea. This has already been reported to our developers. Once the have the fix, it should be included in our next Cornerstone update release.

Thank you for your understanding.

[applemanParticipant]

Hi,

I’m still having this issue on v4.1.1, any idea when/if it will be fixed?

Thanks

[JadeModerator]

Hi @appleman,

Unfortunately there is not ETA for this but we will let you know as soon as this is sorted. Thank you for understanding.

[applemanParticipant]

Ok, thanks

[Paul RModerator]

You’re welcome! 🙂

[George CParticipant]

This reply has been marked as private.

[ChristianModerator]

Hey George,

I checked your site on my phone and it works fine. Can you give us details the OS and browser version your phone.

Thanks.

[George CParticipant]

Droid Turbo 2
5.1.1
Chrome 48.0.2564.95

[ZeshanMember]

Hi George,

Please try adding following CSS code under Custom > CSS in the Customizer:

.touchevents .x-card-outer .x-face-outer {
   height: auto;
}

Thank you!

[George CParticipant]

That worked!

Thank you!

[ChristianModerator]

You’re welcome. Glad we could help. 🙂

[spinejointParticipant]

So great to be able to find solutions to issues in your forum without having to post each question. Keep up the good work!

[Author]

Posts