i need to call a javascript only if screen resolution is greater than 500.

I found below code...

<script type='text/javascript' src='<?php echo $urlPlugin?>js/jquery.themepunch.revolution.min.js?rev=<?php echo RevSliderGlobals::SLIDER_REVISION; ?>'></script>

So, i modified it as below...

if (window.innerWidth > 500) {
    var head = document.getElementsByTagName('head')[0];

    var s1 = document.createElement("script");
    s1.type = "text/javascript";
    s1.src = "http://domain.com/wp-content/plugins/revslider/public/assets/js/jquery.themepunch.revolution.min.js";

However that did not work.

Later i came to know about enqueue function. i have lines as following...

wp_enqueue_script('revmin', RS_PLUGIN_URL .'public/assets/js/jquery.themepunch.revolution.min.js', 'tp-tools', $slver, $ft);

this function auto-calls scripts. so, how do i make it conditional??

instead of enqueueing script i used register_script so that the script can be called later.

Which is working. Then placed javascript code in header.php

However unable to call script if screen is greater than 500.

Also tried this...

 if( $(window).width() > 500 )
 url: 'http://domain.com/wp-content/plugins/revslider/public/assets/js/jquery.themepunch.revolution.min.js',
 dataType: "script",
 success: function() {
  • Edit your JS file to append the conditional to it to execute only when window.innerWidth > 500 and add it with wp_enqueue_script
    – Ismail
    Commented Apr 29, 2017 at 23:57
  • @SamuelElh tried a way, but did not work. Question updated.
    – kpmrpar
    Commented Apr 30, 2017 at 8:31

3 Answers 3


you can use Window matchMedia() Method https://www.w3schools.com/jsref/met_win_matchmedia.asp like this:

 <script type="text/javascript">
        if (matchMedia('only screen and (min-width: 500px)').matches) {


You don't make it conditional on the server side, you just do not initialize/run it on client side when you detect that the width of the window is smaller than 500 pixels.

Trying to detect screen dimension on server side is a big no-no and can fail in all kind of ways (caching, window size change, and probably more).

  • so, what is the way out if ?
    – kpmrpar
    Commented Apr 29, 2017 at 17:04
  • I don't understand what you mean @KishorParmar Commented Apr 29, 2017 at 17:17
  • if 1) don't make it conditional on the server side 2) you just do not initialize/run it on client side........ 3) Trying to detect......is a big no-no then what is the solution? How to achieve?
    – kpmrpar
    Commented Apr 29, 2017 at 17:24

You cannot make it conditional on the server. Follow the steps below.

  1. Enqueue the script in the regular way. I suppose, your code is correct for this- wp_enqueue_script('revmin', RS_PLUGIN_URL .'public/assets/js/jquery.themepunch.revolution.min.js', 'tp-tools', $slver, $ft);

See this for better understanding: https://developer.wordpress.org/reference/functions/wp_enqueue_script/

  1. In your JS, use the condition if( $(window).width() > 500 ) { $.ajax({ data: { 'action' : 'your-action', 'other_key' : other_value }, url: ajaxurl, // previously defined. type: 'POST', success: function(data){ // so something } }) }

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.