Note that there are some explanatory texts on larger screens.

plurals
  1. POHow can I remove a function that was called earlier when a certain condition was met?
    primarykey
    data
    text
    <p>I would like a function to be called only when the browser is greater than <code>640px</code>. So far I have the following, which successfully loads the function when the screen width is greater than <code>640px</code> but the problem I'm facing, is that when the browser width goes back under <code>640px</code>, the function is still active. In my particular scenario I do not want the function loading on smaller displays, hence why I'm trying to call it using the below code. How can I somehow remove/destroy the function when the browser is resized back under <code>640px</code>?</p> <pre><code>&lt;script&gt; function someFunction() { // .. does something when the browser width is greater than 640px } (function($){ //detect the width on page load and load the function $(document).ready(function(){ var current_width = $(window).width(); if(current_width &gt; 640){ someFunction(); } } }); //update the width value when the browser is resized $(window).resize(function(){ var current_width = $(window).width(); if(current_width &gt; 640){ someFunction(); } }); })(jQuery); &lt;/script&gt; </code></pre> <p>Here's a full jsFiddle example of what I have so far as per the help I have had so far. <a href="http://jsfiddle.net/7Dqna/26/" rel="nofollow">http://jsfiddle.net/7Dqna/26/</a></p> <p>I'm implementing a sticky sidebar that scrolls with the page when it hits the top of the browser but I am trying to turn off the function at smaller screen sizes (think mobile).</p> <p>It works when the page is refreshed, but if you make the browser window bigger, then smaller (less than 400px in the jsFiddle example) the menu still is still given the CSS by the function. So I guess it's not picking up the resize thingie.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload