Add a media queries to disable some javascript files

  • Hello all,

    I explain myself, i’m working on a child theme and I load my javascript files in function.php.

    I want to disable some javascript and load another when the website is on tablets or mobile.

    Can you tell me how to do that ? I’m a newbie.
    Thank you

    This is my functions.php for the moment.

    <?php 

function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );

function scrollmagicjsenqeue() {
	wp_enqueue_script( 'child_theme_script_handle', get_stylesheet_directory_uri() . '/js/scrollmagic.js', array( 'jquery' ),'1.0.0',true );
}
add_action( 'wp_enqueue_scripts', 'scrollmagicjsenqeue' );

function idjsenqeue() {
	wp_enqueue_script( 'id_contraire', get_stylesheet_directory_uri() . '/js/id-contraire.js', array( 'jquery' ),'1.0.0',true );
}
add_action( 'wp_enqueue_scripts', 'idjsenqeue' );

function flexsliderjsenqeue() {
	wp_enqueue_script( 'flex_slider', get_stylesheet_directory_uri() . '/js/jquery.flexslider.js', array( 'jquery' ),'1.0.0',true );
}
add_action( 'wp_enqueue_scripts', 'flexsliderjsenqeue' );

function mousejsenqeue() {
	wp_enqueue_script( 'mouse_wheel', get_stylesheet_directory_uri() . '/js/jquery.mousewheel.min.js', array( 'jquery' ),'1.0.0',true );
}
add_action( 'wp_enqueue_scripts', 'mousejsenqeue' );
Viewing 1 replies (of 1 total)
  • Moderator bcworkz

    (@bcworkz)

    Your task will be easier if your first combine all of your wp_enqueue_script() calls into a single callback function. The styles can be included in the same callback as well, since they are all hooked to the same ‘wp_enqueue_scripts’ action.

    function theme_enqueue_scripts() {
    wp_enqueue_script( /* specific parms here */ );
    wp_enqueue_script( /* specific parms here */ );
    wp_enqueue_script( /* specific parms here */ );
    wp_enqueue_script( /* specific parms here */ );
    // etc....
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_scripts' );

    Now apply a if/else logic structure based on wp_is_mobile():

    function theme_enqueue_scripts() {
    // enqueue scripts and styles needed in all cases here
    wp_enqueue_script( /* specific parms here */ );
    // etc....
    if ( wp_is_mobile()) {
        // enqueue scripts and styles applicable to mobile devices only
        wp_enqueue_script( /* mobile specific parms here */ );
        // etc....
    } else {
        // enqueue scripts and styles applicable to non-mobile devices only
        wp_enqueue_script( /* non-mobile specific parms here */ );
        // etc....
    }
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_scripts' );

Viewing 1 replies (of 1 total)
  • The topic ‘Add a media queries to disable some javascript files’ is closed to new replies.