CSS - add background-image to an existing style

95 views
Skip to first unread message

Magnus

unread,
Oct 28, 2012, 12:48:12 PM10/28/12
to google-we...@googlegroups.com
Hi,

I use a DockLayoutPanel as the root panel for my application. It uses the followijg CSS style:

.display
{
 margin:0px;
 /*# center center; */
 background-color: #000000;
 background-image: url(img/Background/std.jpg);
 background-repeat: no-repeat;
 background-position: 0px 60px;
}

Now the users should be able to disable the background image. So I deleted the line for "background-image" above and add it dynamically, if the user wants it:

if (userWantsBackground)
 {
  Style   s = getElement().getStyle();
  s.setBackgroundImage("img/Background/std.jpg");
 }

However, this statement has no effect. No background is shown. When using "inspect element" in chrome, there is no property "background-image".
But I am sure that this code is called (verified with Window.alert).

Questions:
- How can I add the property "background-image" to an existing style?
- What about the image itself? Will it be loaded automatically, when I set the style?

Thanks a lot!
Magnus

Jens

unread,
Oct 28, 2012, 1:02:02 PM10/28/12
to google-we...@googlegroups.com
I guess it is

s.setBackgroundImage("url(img/Background/std.jpg)");

The image should be loaded by the browser as soon as you have called the function and its set to the element.


-- J.

Magnus

unread,
Oct 28, 2012, 1:27:19 PM10/28/12
to google-we...@googlegroups.com
You're right!

Thanks
Magnus
Reply all
Reply to author
Forward
0 new messages