ThemeShaper Forums » Thematic

[closed]

[HOW TO] Add custom js depending on browser type and version

(2 posts)
  • Started 7 years ago by wlanni
  • Latest reply from helgatheviking
  • This topic is not a support question
  1. wlanni
    Member

    Hello!

    I was struggling to do this and thought I'd share it out in case anyone else searches for something similar.

    The problem: I needed to enqueue different versions of a light box js (MediaBoxAdvanced in this case) for different browsers, as for some reason IE7 and IE8 were throwing back an error that the methods in use in the newer MBA weren't supported.

    I always create a custom js_head_load() function that I probably picked up here years ago. And, we all know (or will rapidly find out) about using conditional statements. HOWEVER, there are no specific conditionals for detecting both a browser type AND a browser version number.

    BUT, we also all know (or will rapidly find out) about the really freakin' sweet custom body classes thematic adds, including browser specific classes. (The most recent updated versions of browsers including mobile may have been added recently as well, not sure. See this post.)

    So I added this conditional to my enqueue function that searches the thematic_body_class() set of strings. If ie7 or ie8 appear on that list, it registers the older version of the script. Otherwise, it just uses the most recent version.

    This would be even better if it were converted into a custom conditional function, but at the moment I've got a ton of work to do, so that will have to wait.

    function js_head_load(){
    
    	 $body_classes = thematic_body_class( $print = false);
    	if(!is_admin()){  //so that we're not loading unecessary scripts in the admin
    		wp_deregister_script('jquery');
    
    		//load jquery libs off google
    		wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"), '1.7.0');
    		wp_enqueue_script('jquery');
    
    		wp_register_script('jqueryui', ("https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"), '1.8.16');
    		wp_enqueue_script('jqueryui');
    
    		//detect if browser is ie7 or ie8.
    		//If so, load in old versions of mootools and mediaboxadvanced
    		if ( stripos($body_classes, "ie7") || stripos($body_classes, "ie8") !== false) {
    			wp_register_script('mootools', get_bloginfo('stylesheet_directory') . '/js/mootools-1.2.5-core-yc.js', false, '1.2.5');
    			wp_register_script('mediabox', get_bloginfo('stylesheet_directory') . '/js/mediaboxAdv-1.2.5.js', array('mootools'), '1.2.5');
    
    		} else {
    			wp_register_script('mootools', get_bloginfo('stylesheet_directory') . '/js/mootools-core-1.4.2-full-compat.js', false, '1.4.2');
    			wp_register_script('mediabox', get_bloginfo('stylesheet_directory') . '/js/mediaboxAdv.js', array('mootools'), '1.5.4');
    		}
    		wp_enqueue_script('mootools');
    		wp_enqueue_script('mediabox');
    	}
    }
    add_action('init', 'js_head_load');
    Posted 7 years ago #
  2. nice share!

    Posted 7 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.