PDA

View Full Version : Transparent tab bar, overlay content



squall6969
25 Nov 2010, 3:35 AM
Hi,

I would like to use a transparent bottom tab bar, but due to the layouts involved for my content, everythnig going under my tab bar disapears.

I have just the following configuration:
=>TabPanel (with docked tab bar at the bottom)
=> first card has a card layout

I would like my tab bar to overlay all content. Has anyone an example ?

Thanks in advance.

ddmorales
7 Dec 2010, 5:21 AM
I'm struggling with the same problem.

I assumed "floating: true" would have solved this but my toolbar just dissappears when I apply it.

------------------

EDIT

I misunderstood the float and found the right solution (overlay) here:

http://www.sencha.com/forum/showthread.php?107016-Floating-toolbar-usage&highlight=opacity

Zerogiven
9 Mar 2011, 6:38 AM
Ok i have the same problem here that i want have a transparent docked bar... however the trick with the opacity works fine, but i just need a transparent background.
So if i use opacity at the toolbar i also have transparent items inside it.

What i exactly need is a Toolbar with a (Back) Button and a transparent background (cause there is a fullsize image all the time under the tbar.

So does anyone have an idea how i could make this?

I tried to set it at the SASS var's but i did not found a way for this.

greetz
Chris

nxdp72
28 Jun 2011, 2:21 PM
Chris,

Have you figured out how to do this? I have exactly the same question.

Designworxz
27 Aug 2011, 9:35 PM
Any solution to this guys?

sparkcom
28 Aug 2011, 1:06 PM
my tabbar has this options


tabBar: {
dock: 'bottom',
layout: {
pack: 'center'
},
style: "background: url('images/home-bottom-menu-bg.png') no-repeat; height: 49px"
},
defaults: {
html: 'test',
styleHtmlContent: true
},




the home-bottom-menu-bg.png is transparent

I also have a image background for the whole viewport. and i can confirm that i can see through the tabbar

As I am a newbie, please let me know if it is the correct way to do it (well, although it works)

Ben
http://www.sparkcomputing.co.uk