1

I am wondering how to set transparency to the background of my listview. I added a static picture to my app background and I want it to be visible. I tried several css tricks with backgrounds which worked on chrome, but not on my android device. However I was not even able to set the transparency to the listview's background on chrome. The only thing I succedded with is setting opacity but this also affects text. Also it is not problem of affecting child elements in css.

I followed this:
http://www.w3schools.com/css/css_background.asp
and this
http://www.w3schools.com/css/css_image_transparency.asp
I also tried adding transparent pictures as a background listview background and list elements backgrounds.

I dream of something at least similar to this: http://www.santyago.pl/media/zoom/publish/2011/09/bzwbk04.png

I use jQuery-Mobile and PhoneGap.

I tried to find similar questions but I only found ones connected with "plain Android": Transparent/dim ListView background - I want to destroy ListView activity when clicking on background

Community
  • 1
  • 1
Piotr Krysiak
  • 2,815
  • 3
  • 23
  • 35
  • Obviously not sure exactly what you've tried but could you set a small, repeated transparent png as the background of your listview? – Billy Moat Sep 05 '12 at 09:16
  • Just as I wrote in second paragraph: " also tried adding transparent pictures as a background." – Piotr Krysiak Sep 05 '12 at 09:44

1 Answers1

1

This answer is related to yours: CSS background-image-opacity?

Modyfing opacity of parent element will always affect the children elements. You can try this approach: http://robertnyman.com/2010/01/11/css-background-transparency-without-affecting-child-elements-through-rgba-and-filters/

... But still - if you want a simple solution - just change the opacity of an image in gimp/photoshop or other editor and then use it as background for your container.

Community
  • 1
  • 1
biphobe
  • 4,525
  • 3
  • 35
  • 46
  • Have you read my question carefully? I tried so. I does not work. Thanks for answer anyway. – Piotr Krysiak Sep 11 '12 at 09:33
  • @Borewitsch Did you read my answer carefully? It was just one of 3 different approaches that I suggested. Besides - it is not possible for this method to NOT WORK. You must be doing it wrong. Post a demo of your code through jsfiddle for example so that we will be able to assist you further. – biphobe Sep 11 '12 at 18:08
  • I tried it all. There are many suggestions on web, I tried a lot, but none specific to jqm, which I am asking about. Some of them work locally on chrome but it does not on android device. I think it is specific for jqm listviews and may not be possible now. Anyway I will provide jsfidle code as soon I will be able to. – Piotr Krysiak Sep 11 '12 at 19:02