CODEWITHSUNDEEP
javascriptjquery
Dániel Erényi
Dániel Erényi

Reputation: 11

Enable this script on mobile only

I have this script:

<script>
jQuery(function($){
    if (!$('#et-info').length) { 
         $('#top-header .container').prepend('<div id="et-info"></div>'); 
    }
    $('#et-info').prepend('<span style="margin:0 10px">NYITVATARTÁS: H-Sz 10-19, V 10-16</span>');
})
	</script>

I want to enable this only on mobile.

Upvotes: 0

Views: 940

Answers (3)

thefonz
thefonz

Reputation: 96

You may change the "739" to a different number depending on the device resolution you are targeting.

if ( $(window).width() > 739) 
     {    
    //Add your javascript for large screens here 
     }  
     else 
     {   
    //Add your javascript for small screens here 
    }

Upvotes: 1

Gaurav Mourya
Gaurav Mourya

Reputation: 177

Use the code below. This code will work on screens less than 600 screen size.

$(document).ready(function(){

    if ($(window).width() < 600) {
      jQuery(function($){
            if (!$('#et-info').length) { 
                 $('#top-header .container').prepend('<div id="et-info"></div>'); 
            }
            $('#et-info').prepend('<span style="margin:0 10px">NYITVATARTÁS: H-Sz 10-19, V 10-16</span>');
        })

    }
});

Upvotes: 1

jrswgtr
jrswgtr

Reputation: 2379

You can us JavaScript to check the viewport width.

jQuery(document).ready(function($) {
    const viewportWidth = window.innerWidth;
    if (viewportWidth < 640) {
        if (!$('#et-info').length) {
            $('#top-header .container').prepend('<div id="et-info"></div>');
        }
        $('#et-info').prepend('<span style="margin:0 10px">NYITVATARTÁS: H-Sz 10-19, V 10-16</span>');
    }
});

Upvotes: 1

Related Questions