Delving into the World of CSS

Question

Delving into the World of CSS

I have been working on changing the background image using this JavaScript code, but I am not sure what to reference in the CSS file. Despite reading through everything, my screen still remains blank.

$(function() {
var body = $('body');
var backgrounds = new Array(
'url(images/bg.jpeg)',
'url(images/bg2.jpeg)',
'url(images/bg3.jpeg)'
);
var current = 0;

function nextBackground() {
body.css(
'background',
backgrounds[current = ++current % backgrounds.length] 
);

setTimeout(nextBackground, 10000);
}
setTimeout(nextBackground, 10000);
body.css('background', backgrounds[0]);
});

In addition, I have included jQuery by linking to the Google CDN.

Thank you so much for your assistance.

T

javascript jquery html css

Answer 1

Answer №1

There may not be an official answer for this question, but I will provide a response based on the comments.

The issue stemmed from the use of ‘curly quotes’ instead of 'straight quotes.'

Answer 2

There may not be an official answer for this question, but I will provide a response based on the comments.

The issue stemmed from the use of ‘curly quotes’ instead of 'straight quotes.'

Answer 3

Answer №2

The provided code contains errors such as incorrect quote marks for strings and a missing comma after the second background value.

$(function() {
  var body = $('body');
  var backgrounds = new Array(
    'url(images/bg.jpeg)',
    'url(images/bg2.jpeg)',
    'url(images/bg3.jpeg)'
  );
  var current = 0;

  function nextBackground() {
    body.css(
      'background',
      backgrounds[current = ++current % backgrounds.length]
    );

    setTimeout(nextBackground, 10000);
  }
  setTimeout(nextBackground, 10000);
  body.css('background', backgrounds[0]);
});

You can view a demo showcasing the corrected version with colors instead of background images: https://jsfiddle.net/kb58tvo9/1/

A cleaner version of the code can be found here: https://jsfiddle.net/kb58tvo9/2/

Answer 4

The provided code contains errors such as incorrect quote marks for strings and a missing comma after the second background value.

$(function() {
  var body = $('body');
  var backgrounds = new Array(
    'url(images/bg.jpeg)',
    'url(images/bg2.jpeg)',
    'url(images/bg3.jpeg)'
  );
  var current = 0;

  function nextBackground() {
    body.css(
      'background',
      backgrounds[current = ++current % backgrounds.length]
    );

    setTimeout(nextBackground, 10000);
  }
  setTimeout(nextBackground, 10000);
  body.css('background', backgrounds[0]);
});

You can view a demo showcasing the corrected version with colors instead of background images: https://jsfiddle.net/kb58tvo9/1/

A cleaner version of the code can be found here: https://jsfiddle.net/kb58tvo9/2/

Delving into the World of CSS

Answer №1

Answer №2

Similar questions

Obtain JSON information and integrate it into an HTML document with the help of

Is there a way to change the background color of product blocks on Shopify in a dynamic

The function jQuery(" ").datepicker({ }) does not function correctly in Internet Explorer versions 7 and 8

On an iPad, the clickable area outside a div element is not functioning properly

The webpage automatically reloads when triggering a jQuery ajax request to an ActionResult

Leveraging the outcome of a for loop in order to set a condition within an else if statement

When PHP echo of json_encode triggers an error, AJAX status 200 will be raised

AngularJS ng-include nested form configuration

Sinon's fakeTimers failing to trigger

Vuetify: how to disable the color transition for v-icon

Troubleshooting Event Tracking Problems with Brave Browser on PostHog

Is it possible to rearrange the node_modules directory?

Revamping status and backend systems

Simulate a failed axios get request resulting in an undefined response

Arrange the table by column following a service request

Tips on updating arrow button icon when clicked using jquery

"Data is not defined" error message is triggered when using jQuery DataTable Row Details

Create a servlet that generates a PDF file and displays it in a fresh browser tab. However, the PDF document will be blank

Navigating through different pages and updating the URL using AJAX requests

Introduction to React with Typescript: Greeting the World