Div Background Image

Asked
Viewd3400

0

I am working in Mojo SDK which is used to develop Apps for Palm Pre webOS.

I am trying to add an image to the background of the div dynamically and fade it out. I am using the following code to set background of the div dynamically:

this.controller.get("imageDiv").backgroundImage = "url(../images/marks/mark-" + this.markNo + ".png)"; // Not Working

this.controller.get("imageDiv").style.background = "url(../images/marks/mark-" + this.markNo + ".png)"; // Not Working


$("imageDiv").backgroundImage = "url(../images/marks/mark-" + this.markNo + ".png)"; // Not Working

$("imageDiv").style.background = "url(../images/marks/mark-" + this.markNo + ".png)"; // Not Working

I have also tried to set a static image to the div as well but that isn't working too. Adding a background image to body is working.

#imageDiv /* Not Working */
{
    background: url(../images/launch/launch-image.png) center center;
}

imageDiv /* Not Working */
{
   background: url(../images/launch/launch-image.png) center center;
}

.imageDiv /* Not Working */
{
   background: url(../images/launch/launch-image.png) center center;
}
<div id="imageDiv"></div>

Kindly have a look and let me know if I am doing anything wrong here.

Thanks.

Haseeb Khan

3 ответов

2

Убедитесь, что размер тега DIV соответствует области, которую вы хотите показать:

 #imageDiv
{
    background: url(../images/launch/launch-image.png) center center;
    width: 400px;
    height: 400px;
}
 
1

У div нет содержимого, поэтому размер будет 0 x 0. Попробуйте добавить что-нибудь в div и посмотрите, есть ли фон. Используйте #imageDiv для сопоставления по идентификатору.

0

use

#imageDiv {
 background: url(../images/launch/launch-image.png) center center;
 width: 100%;
 height: 100%;
}