How can I add if condition

Question

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>

Use [ternary operators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator) — Rahil Wazir, Sep 22 '14 at 09:34
@RahilWazir Can you please explain how to implement in our above script. Thanks. — HDP, Sep 22 '14 at 09:49

Yousef_Shamshoum · Accepted Answer · 2014-09-22T09:47:40.663

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>

edited Sep 22 '14 at 09:47

answered Sep 22 '14 at 09:37

Yousef_Shamshoum

737
3
12

I have try. but, I have not success. How can I add this in our above script. any idea. Thanks. – HDP Sep 22 '14 at 09:44

score 0 · Answer 2 · answered Sep 22 '14 at 09:53

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.

How can I add if condition

2 Answers2