1

I have use elevateZoom jquery plugin. I want to disable elevateZoom in mobile(less than 600px width device).

So, How can I add(if condition) zoomEnabled: false, instead of zoomEnabled: true, in below jquery. when Open in mobile.

<script> $("#zoom_01").elevateZoom({ gallery:'gallery_01', zoomEnabled: true, cursor: 'pointer', galleryActiveClass: 'active' </script> 
3
  • Use ternary operators Commented Sep 22, 2014 at 9:34
  • zoomEnabled: isOnMobile Commented Sep 22, 2014 at 9:35
  • @RahilWazir Can you please explain how to implement in our above script. Thanks. Commented Sep 22, 2014 at 9:49

2 Answers 2

1

You can use the .width method in jquery to determine the width of the window and just change the object properties accordingly.

You can use it like this:

<script> if ($( window ).width() < 600) { $("#zoom_01").elevateZoom({ gallery:'gallery_01', zoomEnabled: false, cursor: 'pointer', galleryActiveClass: 'active' } else { $("#zoom_01").elevateZoom({ gallery:'gallery_01', zoomEnabled: true, cursor: 'pointer', galleryActiveClass: 'active' } </script> 
Sign up to request clarification or add additional context in comments.

1 Comment

I have try. but, I have not success. How can I add this in our above script. any idea. Thanks.
0

A more readable approach (at least for me):

<script> $("#zoom_01").elevateZoom({ gallery:'gallery_01', zoomEnabled: ( $(window).width() >= 600 ), cursor: 'pointer', galleryActiveClass: 'active' }); </script> 

but to be fair: read a javascript tutorial or 2 and you could've figured this out yourself.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.