The resize() function in jQuery triggers a stack overflow exception

I am trying to manage the resizing of a div on my website, but I am encountering a stackoverflow exception when using the resize function. Can someone please help me understand what I am doing wrong?

For reference, here is a jsfiddle example: https://jsfiddle.net/u9q4k4ce/

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script>
    function initiate() {
        $(document).ready(function () {
            $("#divId").off('resize').on('resize', function () {
            });

            $(window).bind('resize', function () {
                $("#divId").resize();
            });
        });
    }
</script>

</head>
<body onload="initiate()">
<div id="divId" style="position:absolute;left:0px;right:0px;top:0px;bottom:0px;"></div>
</body>
</html>

In the jsfiddle example, any window resize triggers a stack overflow. I am using the latest version of Chrome on Windows 7.

Any assistance on this issue would be greatly appreciated.

Answer №1

For more information, take a look at https://api.jquery.com/resize/. Make sure to include a callback or handler when using the resize() function.

$( window ).resize(function() {
  $( "#log" ).append( "<div>Handler for .resize() called.</div>" );
});

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Decode JSON and generate a user-friendly Array

My aim is to extract and organize the JSON data received from an external API into a custom array. However, I am encountering two challenges: I'm struggling to access the value labeled #2 under "Meta Data". If I want to extract the first array n ...

The combination of Javascript and CSS allows for interactive and visually

I'm currently working on a project where I had to create a simulated weather page using only Javascript. However, I am struggling with the overall layout and have a few questions that I hope someone can help me with: Despite trying various methods ...

Is it possible to conceal the source code within the dist js file using Vue JS?

I am looking to create a detailed logging page that showcases the logs without revealing the specific type of logging. I want to prevent users from accessing the minified vue JS script and easily reading the logged information. Is there a way to implemen ...

Using PHP and jQuery to fetch data from two different tables simultaneously

This code is set up to extract data from a single table exclusively. How do I modify it so it can retrieve data from two different tables and then store that information in another table? My goal is to achieve something similar to this: https://i.stack.i ...

In the world of Vue3 and Vue-Router, accessing parameters using the $route object is a breeze during development, but may prove trick

Struggling with building a Vue3 app for production as 90% of my scripts are broken due to variables being undefined. It's baffling why this happens. One concrete example is: In dev mode, accessing a parameter value in my route using this.$route.param ...

Discord.js version 13 encountered an issue where it is unable to access properties of undefined while

Having trouble with creating a warn system that just won't work! I've tried various solutions but nothing seems to be fixing it. Would greatly appreciate any help! Error Log: [FATAL] Possibly Unhandled Rejection at: Promise Promise { <reje ...

Retrieve real-time video information from YouTube

When a user inputs a YouTube video URL into my form, I want to automatically retrieve and display certain information from YouTube such as the title, description, and dimensions of the video. However, I'm struggling to find examples that demonstrate h ...

What is the process for creating a global variable in JavaScript?

Having trouble changing the value of "invocation_num" within a loop? I attempted to modify it as follows, but ended up with an undefined value. Any help would be greatly appreciated. $(document).on("click", '.favoret', function(){ document ...

Categorize Jekyll tags into two distinct groups

I am currently using Jekyll to construct a GitHub Pages website. The grid and column layout are powered by Bootstrap. When it comes to listing all the posts linked to a specific tag, I begin by sorting the tags and then listing all the posts associated wit ...

Is it possible in Jquery Keyboard to automatically synchronize the value I am typing with the input field?

I have integrated the jquery keyboard plugin into my project. Currently, when a user clicks on an input (A), the keyboard appears at the bottom of the page showing input (B) as well. As the user types, only the value of input (B) changes on the keyboard, ...

I currently have an array of strings and wish to print only the lines that include a specific substring

Here i want to showcase lines that contain the following strings: Object.< anonymous > These are multiple lines: Discover those lines that have the substring Object . < anonymous > Error: ER_ACCESS_DENIED_ERROR: Access denied for user ' ...

Issue with hiding div using jQuery's length option

I'm currently using Drupal 7.0 along with the Galleria Javascript Image Gallery in fullscreen theme. My theme includes two navigation buttons, and here is the CSS code for them: .galleria-image-nav { height: 159px; opacity: 0.8; position: fixed ...

Retrieving values using the jQuery .each() function and passing them to an AJAX request

Is it possible to set jQuery AJAX outside of .each in the script provided below? $('#btnUpdate').click(function() { $('#result').html(''); $('.moduleIDInput').each(function() { var uid = $(this). ...

Using Datatables to Retrieve Data from Server with Ajax via API Endpoint

After making a GET request to an API, I received 1000 accounts. Here is a link to my sample data: Following the recommendations on the Datatable website, here are my settings: var account_table = $('#account-table').DataTable({ "processing" ...

Discover a corresponding object within an array

I am currently dealing with an array of objects in Javascript where I need to verify if a certain value exists within any object and return the corresponding id. The issue arises when using the some() function as it only seems to match the first object. T ...

Preventing Duplicate Form Submissions in Rails 5 using jQuery

As a coding novice, I'm currently working on my Rails 5 app and implementing image cropping and uploading directly to AWS S3 from the client side using blueimp/jQuery-File-Upload. However, I have encountered an issue where multiple form submissions o ...

What steps should I follow to set JSONP as the dataType for a request in an Angular $http service?

I have a good understanding of how to use jQuery's $.ajax: $.ajax({ url: //twitter endpoint, method:"GET", dataType:"jsonp", success:function() { //stuff } }); Is there a way to set the JSONP datatype for an angular $http service reque ...

Expandable fluid inline svg that dynamically fills the remaining space alongside text within a flex row

How can I ensure that an inline SVG occupies all available space within a row without specifying its height across different screen sizes? The solution involves setting the SVG to have 100% height with a viewBox, allowing it to adjust accordingly while ma ...

Tips for aligning divs in Zurb Foundation 3 framework

My design conundrum involves a 12 column row and trying to make a series of four div blocks stay in a row without stacking as the browser size decreases. Currently, the divs start to stack when the browser gets smaller. I have 4 divs that should be displa ...

Using jQuery to make hidden divs visible again

I have a group of products arranged side by side within a div, and I am using a script to hide them one by one. However, at a certain point, all the products have disappeared, and I am struggling to make them re-appear. I've attempted to use .show bu ...