Menu
Im using JQuery to set the background image of a div as follows:
$(document).ready(function() {
$('#pic').css("background","url(images/pic.jpg)");
});
But the image does not get displayed. How to fix this ?
Thank You.
221
asked Oct 23 '09 08:10
You can change the <body> background color by first selecting the element using jQuery selector $() and chain it with the css() method as follows: $("body"). css("background-color","blue"); The code above will change the background color from yellow to blue .
To change the background image using jQuery, you can use the jQuery CSS() method. For this, the whole property value is specified using the url() functional notation. Approach: Suppose we have an image URL stored in a variable and then use css() method to change the value of background image.
The default button in HTML can be changed to an image using CSS. The required button is selected using the respective CSS selector. The background property can then be set to include a background image and change the image type as required. The border of the button can also be removed to show only the image itself.
CSS allows you to add multiple background images for an element, through the background-image property. The different background images are separated by commas, and the images are stacked on top of each other, where the first image is closest to the viewer.
maybe it also works with background but i always use
background-image
And also I always put quotes around the path
$('#pic').css("background-image","url('images/pic.jpg')");
Should work, but have you tried using "background-image" instead of "background"?
Also, can you navigate to the image through your browser correctly? I.e. yourdomain/images/pic.jpg?
Edit: Also, have you set a width and height for the div? The div will not auto-resize for a background image.
44
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
