0

In my gwt-application i got a tree with a few images. These images can be copied by drag and drop to a panel. Now i want to make them resizable in this panel. when i test my css-code with a concrete image-path for "background-image", resize:both and background-size:cover works! My problem is, that i cannot set a concrete url to the css, becacuse the imagepath is dynamic. when i delete background-image from css and set backgroundimage in my code, the surrounding container resizes, but the image not. Is it possible to set 'background-image' to the image that I choose during runtime? how can i solve that with css? Thank you!!

Jogi
  • 25
  • 1
  • 8
  • Can you show some code? I can say things like, set `background-size` to `contain` or `cover` (whatever fits your needs), but whether that will work or not depends on what you have already. – Mr Lister Apr 09 '16 at 12:35
  • background-size is not the problem... when i test my css-code with a concrete image-path for "background-image", it works! but the problem is, that i cannot set a concrete url to the css, beacuse the imagepath is dynamic... :( – Jogi Apr 09 '16 at 13:11

1 Answers1

0

You can set background image at any time in your code. For example:

myPanel.getElement().getStyle().setBackgroundImage("url(/myImage.jpg)");

To make it resizable, you need to apply the correct CSS to this panel. There are several CSS options for you to consider.

Community
  • 1
  • 1
Andrei Volgin
  • 40,755
  • 6
  • 49
  • 58
  • when i test my css-code with a concrete image-path for "background-image", resizing works! but the problem is, that i cannot set a concrete url to the css, beacuse the imagepath is dynamic... :( how can i solve that in css? – Jogi Apr 09 '16 at 14:58
  • You can't do it in CSS. You need to use the code that I provided to set the path when you know it. – Andrei Volgin Apr 09 '16 at 19:48
  • okay, but how do i set url dyamic? >myPanel.getElement().getStyle().setBackgroundImage("url(?)"); – Jogi Apr 09 '16 at 23:05
  • I don't understand your question. Just replace "?" with the URL that you are trying to set. And when you get a new one, call this line of code again with the new URL. Etc. – Andrei Volgin Apr 09 '16 at 23:42
  • Let me try to explain my problem better:) in a scroll panel i got a tree with a few image-widgets. When one of these widgets is dragged and dropped to its target=(absolute panel), the original-widget is replaced by a widget-copy. In the target the dropped widget should be resizable. When i add css with resize-property, the resize-symbol in the corner is shown. I can pull it, but the widget is not resizing, just a „border“ surrounding the widget. – Jogi Apr 10 '16 at 00:03