What happens if the conditions in a JavaScript if statement are not satisfied?

It seems I've encountered a puzzling logic error that has me stumped. While all conditions besides 1024 are triggering the correct if statements, for some mysterious reason, the 1024 condition isn't being met. Any insights would be greatly appreciated!

var width = 1024; //screen.width;
var height = 768; //screen.height;
var subpageModifier;

if (width > 360 && width < 767) {
    subpageModifier = .28;
};
if( width > 767 && width < 800){
    subpageModifier = 0.15;
};
if (width > 800 && width < 961) {
    subpageModifier = .15;
}; 
if (width > 961 &&  width >1135){
    subpageModifier = 0.3;
};
if (width >1135 && width < 1535){
    subpageModifier = 0.15;
};

Just to note, my development is based on AngularJS if that information could be of assistance.

Answer №1

(width > 961 &&  width >1135)

Change the second > to a <.

(width > 961 &&  width <1135)

By using an if-else statement, you can avoid checking every condition once a match is found.

Answer №2

if (width > 961 &&  width >1135){
    subpageModifier = 0.3;
};

should now be under 1135:

if (width > 961 &&  width < 1135){
    subpageModifier = 0.3;
};

Answer №3

Instead of

if (width > 961 &&  width >1135){

Use:

if (width > 961 &&  width < 1135){

Ideally everything should be:

var width = 1024; //screen.width;
var height = 768; //screen.height;
var subpageModifier;

if (width >= 360 && width <= 767) {
    subpageModifier = .28;
}else if( width > 767 && width <= 800){
    subpageModifier = 0.15;
}else if (width > 800 && width <= 961) {
    subpageModifier = .15;
}else if (width > 961 &&  width <= 1135){
    subpageModifier = 0.3;
}else if (width >1135 && width <= 1535){
    subpageModifier = 0.15;
}else{
    //do something
}

Answer №4

Our latest findings reveal 3 important updates:

  1. Avoid using semi-colons after if statements.
  2. Utilize if-else for the outlined conditions.
  3. The
    if (width > 961 &&  width >1135){
    condition is flawed in its second part.

Answer №5

Let's tackle the issue at hand:

if (width > 961 &&  width > 1135){
    subpageModifier = 0.3;
};

Both symbols represent greater than

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

The onChange event will not be triggered in an input component that is not intended to be uncontrolled

Could someone please assist me in understanding why the onChange event is not being triggered? I am customizing ChakraUI's Input component to retrieve a value from localStorage if it exists. The component successfully retrieves the value from localS ...

Issue with retrieving data from MySQL database using PHP in Chart.js

I am currently facing an issue while trying to populate a chart using the ChartJS plugin with data from my MySQL database. I keep encountering the error message: mysqli_fetch_assoc(): Couldn't fetch mysqli_result in ... Despite using json_encode, ...

Is it feasible to merge Apollo queries within the context of Nuxt?

Incorporating nuxt and apollo together using the https://github.com/nuxt-community/apollo-module module has been a successful venture. A GraphQL query was crafted and tested in GraphiQL to obtain information about a specific page along with general SEO de ...

When attempting to send a fetch request in the most recent rendition of NextJS, it ends up with an error of 'failed fetch'

I am currently working on a nextjs (v.13.4.19) / strapi (v.4.12.5) application and facing issues when trying to make a request to the strapi endpoint using the fetch function. I have attempted several troubleshooting steps such as: changing localhost:1337 ...

Troubleshooting [object Object] Error in Node.js using Express

This is my Unique Code handleLoginRequest(req, res, next) { try { const {username, password} = req.body; const user = await UserModel.findOne({username}); if(!user) throw {status: 401, message:'Invalid username or password' ...

Where should custom PHP code be placed in Prestashop 1.7.5?

Currently, I am facing the challenge of incorporating a custom PHP code snippet into Prestashop's file structure so that it is accessible on all pages such as the cart, categories, and CMS pages. After some research, I have found suggestions to place ...

Unable to retrieve information stored in an object within a Vue component

I'm having trouble accessing the data within the user object. { "channel_id": 2, "user": { "id": 1, "name": "Clyde Santiago", "email": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="187c7d606c7d6a7c7d6e28 ...

AngularJS: Default ng value not being recognized by ng model

I have an input field with a default value of 0, but my JavaScript is throwing an error saying it's undefined. If I enter any value, it shows up fine, but I want to display the default value. <tr ng-repeat="r in rvm" > <td> ...

Deletion of a custom function in JavaScript

I have written some basic code to generate and remove an image using functions. Specifically, I need help with removing the image created by the function Generate() when a button linked to the function Reset1() is clicked. Here's the code snippet for ...

Is it possible to customize the CSS styles of a jQuery UI modal dialog box?

Having trouble with my CSS styles not applying to a dialog modal added to my website using jQuery UI, even when using '!important'. I suspect that the predefined jQuery or UI CSS styles from a CDN link are preventing me from overriding them. The ...

Having trouble with importing and receiving the error message "Module 'clone' not found."

When trying to use clone.js in Angular 2, I imported it with import * as clone from 'clone'. It was listed in my package.json dependencies and successfully imported into node_modules. However, when viewing the output, I encountered the error mes ...

How can I determine the Windows service pack version directly from my web browser?

Is there a method to determine the installed service pack from the browser? It doesn't seem to be available in System.Web.HttpBrowserCapabilities in asp.net. I am looking for a solution to alert users about the necessity of updating to XP Service Pack ...

Issue: Adjustment of elements' size using an "onclick" method when reaching specific screen width

Seeking assistance with implementing media queries in JavaScript. Can an object be resized from JavaScript code based on a specific screen width, rather than the default one? For example, if I have a button that opens a div with a height of 600px when cli ...

Issue with Angular: $rootScope:infdig error encountered while trying to assign a directive attribute using a controller variable

One of the directives I implemented prevents certain values from being entered into an input field. For instance, if the user tries to enter 0, 10, or 17, a validation error will occur. Although this functionality is functioning correctly, I now need to d ...

Issue with deleting and updating users in a Koa application

My goal is to create a function that deletes a specific user based on their ID, but the issue I'm facing is that it ends up deleting all users in the list. When I send a GET request using Postman, it returns an empty array. What am I doing wrong? I do ...

How to sync two carousels in Bootstrap 5 to slide simultaneously with just one click on the next and previous buttons

I am trying to implement dual sliding carousels using Bootstrap 5, but I am encountering issues with getting them to slide simultaneously. Despite incorporating data-bs-target=".carousel", the synchronization isn't working as intended in my ...

There was a lack of communication or feedback after attempting to use

Attempting to create a small service utilizing Apache Cordova and JavaScript has led me to a unique challenge. Typically, I prefer avoiding JS in favor of ready-made solutions, but this task calls for a special touch. The function of my app is straightfor ...

Selenium Tips: Ensuring RemoteDriver Remains Connected to the Active Browser Tab

Currently working on a unique Windows application that utilizes voice commands to control web browsers. I am trying to figure out the best approach when users add tabs and modify the selected tab as needed. Unfortunately, RemoteDriver only supports swi ...

Angular ng-repeat table displaying items in alternating columns

Just diving into the world of Angular and currently working on a page that utilizes ng-repeat with a table element. The repeating function is working perfectly, as shown below: Now, I'm looking to have every other table displayed side by side before ...

Pass PHP array to a JavaScript file using AJAX

Starting with a basic knowledge of PHP and AJAX, I was tasked with creating a form that prompts the user to choose between two car manufacturers. Upon selection, the form should display all models of the chosen make from a multidimensional array stored in ...