INTERACT FORUM

Please login or register.

Login with username, password and session length
Advanced search  
Pages: [1]   Go Down

Author Topic: Transparent background for webgizmo.  (Read 3446 times)

MANswers

  • Recent member
  • *
  • Posts: 7
Transparent background for webgizmo.
« on: August 10, 2013, 01:22:52 am »

Hi all,

I am using Webgizmo on an iPad 2.
Love the ease of webzimo. Is there any way to remove the background all togather.. make it transparent.
I tried to edit the default.css file and removed the background: #262626; line all togather, instead it made the background white.
I have embedded webgizmo to irule, and irule has its own background, hence want to remove the dark grey background, so that the webgizmo's icon blend with the ipad's backgroun in irule.
Logged

WinoOutWest

  • Regular Member
  • Galactic Citizen
  • ****
  • Posts: 358
Re: Transparent background for webgizmo.
« Reply #1 on: August 10, 2013, 09:02:21 am »

+1

I would like to do this as well.  I am embedding Gizmo in iRule and this would be great to do.
Logged

MANswers

  • Recent member
  • *
  • Posts: 7
Re: Transparent background for webgizmo.
« Reply #2 on: August 10, 2013, 01:19:57 pm »

Been trying really hard, looked up all css related guides tips and tutorials online to see if a blank gif can be inserted instead of the background color, the problem is it defaults out to white, and when using transparent RBGa value opacity it starts making the white background dark or light, but does not actually show the transparent background itself.

Any help guys.. need a little rallying here.
Logged

MANswers

  • Recent member
  • *
  • Posts: 7
Re: Transparent background for webgizmo.
« Reply #3 on: August 10, 2013, 03:31:29 pm »

I did it!!! I am gonna post back in an hour the steps on how to get a transparent background for the webgizmo.
Logged

WinoOutWest

  • Regular Member
  • Galactic Citizen
  • ****
  • Posts: 358
Re: Transparent background for webgizmo.
« Reply #4 on: August 10, 2013, 04:01:14 pm »

Nice work.  I, for one, will appreciate if you post your process.
Cheers!
Darren
Logged

MANswers

  • Recent member
  • *
  • Posts: 7
Re: Transparent background for webgizmo.
« Reply #5 on: August 10, 2013, 04:23:19 pm »

For I will post.. in few hrs for sure, just making few adjustments... making some more mods for the default icons.
Are you on AVS irule thread? I am on there by the alias holyindian :)
Logged

MANswers

  • Recent member
  • *
  • Posts: 7
Re: Transparent background for webgizmo.
« Reply #6 on: August 11, 2013, 12:40:34 am »

Here are a few screenshots of my iRule setup which is still under heavy construction... a lot will be changed soon.

The main page


A preface of the internal workings of just one of my components



Here is the webgizmo page.. i havent got the time today (due to wife's shopping) to change and tweak stuff on this page, but i plan to modify the top bar and the transport media icons as well.



So, here is what i did.

Locate the file default.css and look for these and change the one marked in red.

body, input
{
   font-size: 16px;
   font-family: Tahoma, Geneva, sans-serif;
   font-weight: normal;
   background: #333333;   
        color: #BBBBBB;
}


body, input
{
   font-size: 16px;
   font-family: Tahoma, Geneva, sans-serif;
   font-weight: normal;
   background-image:url('images/back.jpg');
   color: #BBBBBB;
}

You can see above that i have added a jpg file in the images folder.. that image is nothing but the irule's background wallpaper.

Here is what you can do to make sure the overlay wallpaper looks in sync.
1. Take a screenshot of your webgizmo page in the ipad and open it in photoshop.
2. Create a new layer and add the original irule's background, make it 50% opaque and corp out around the edges of the webgizmo's layout. save the corpped image and copy this image to the images folder of your webgizmo.

If you need help in the above steps, pm me your screenshots and the wallpaper and i will make it for you.
Logged
Pages: [1]   Go Up