user2179195
user2179195

Reputation: 1

Jquery how to run a function only if condition is true

I have a function that check if CSS value exists, the problem is that I need the function to work only when the CSS class exists, currently the function running all the time because I'm using else condition (that need to re do the if condition).

 //use for @media only screen and (max-width: 767px) detection    
 $(window).resize(function(){
    if ($('#mobile-view').css('visibility') === 'hidden') {
        $("#product-gallery").insertAfter("#product-info");
    }
     else { 
         $("#product-info").insertAfter("#product-gallery");
    }
 });  

Upvotes: 0

Views: 2826

Answers (4)

HasanAboShally
HasanAboShally

Reputation: 18675

Try using $("#mobile-view").is(":visible") == true

Upvotes: 0

DevelopmentIsMyPassion
DevelopmentIsMyPassion

Reputation: 3591

you can use hasClass

if ($('#mobile-view').hasClass(className)) {
 // put your logic inside this.
}

Upvotes: 0

Ja͢ck
Ja͢ck

Reputation: 173522

You could use the :hidden pseudo selector:

if ($('#mobile-view').is(':hidden')) {
    $("#product-gallery").insertAfter("#product-info");
} else {
    $("#product-info").insertAfter("#product-gallery");
}

See also: .is() and :hidden

Upvotes: 3

chandresh_cool
chandresh_cool

Reputation: 11830

Change it to

if ($('#mobile-view').is(":visible")) {

    $("#product-info").insertAfter("#product-gallery");
} else {
     $("#product-gallery").insertAfter("#product-info");
 }

Upvotes: 1

Related Questions