Tabbed Panels - Tab shows over a dropdown menu

Hello,
As you see in this link
Tab
Problem i have a problem the tabbed panel widget. The tab seems
to come in front of a drop-down menu that i have (not spry)
Any suggestions are much appreciated

Hi,
most probably you have a css problem in your page that refers
to z-index. Check to see which one, the menu or the tabbed panel
(if you added a z-index) have the z-index value grater. Normally
the menu bar should have a bigger z-index to be displayed in top of
the other elements.
If you use the Spry menu bar and the Tabbed panel you don't
have this problem.
If you want more help from us, please give us a live url to
investigate the problem.
Thanks,
Diana

Similar Messages

Color of selected tab panel tab

Hello all,
I'd like to know the orange like color of the upper part of a selected tab panel tab, see the picture below.
Actually, these are two colors, orange and a darker, 'shaded' orange. I don't mind which color value I can obtain, but I'd like to use the same color for other controls (LED, decoration frame) as well.
Does this color depend on the Windows theme? If so, I'd be happy about a possibility of obtaining this property programmatically.
If this color is always the same, I can obtain it myself using Photoshop...
Thanks a lot,
Wolfgang
Solved!
Go to Solution.

When the panel has ATTR_CONFORM_TO_SYSTEM_THEME set, CVI lets Windows draw the tabs by calling DrawThemeBackground with partIDs such as TABP_TABITEM, etc. The picture that you posted is the XP theme. The Windows 7 theme is different and it looks like this...
I checked out the Windows function GetSysColor, but didn't see a way to get that color. Anyway, since the tabs draw differently on XP and Vista/Windows 7, you may not want to use that color in different controls.

Link to Spry Tabbed Panels Tab?

Is it possible to link to a specific Spy Tabbed Panels tab from another page?
Thanks.

It is possible to link to a specific tabbed panel from another page, may I suggest you use the following link to visit a post in the spry forum were you will find all the steps needed to do this.
http://forums.adobe.com/thread/48312
Richard

I'm using Windows Illustrator CS4, and i cant find the artboard menu pallate. Its not showing under Window Dropdown menu either.

I'm using Windows Illustrator CS4, and i cant find the artboard menu pallate. Its not showing under Window Dropdown menu either. How can i locate it or toggle it to turn on again?

I'm not sure what artboard view is, sorting and naming artboards is not available in CS4 either, sorting however is possible via script workaround,
Introducing: re Arrange Artboards v2 Script

IE6 displays AutoSuggestions under Tabbed Panel tabs

Problem: I am using the autoSuggest widget on the same page
as tabbed panels. In FireFox, it works GREAT! In IE6, I have a
problem with the suggestions being under the tabbed panels tabs
(possibly under the tabbed panel tab group)... I found a suggestion
which stated to set the autosuggest to z-index: 2002, and set it to
absolute positioning, both of which I've done.
When I look at the source using the IE Dev Toolbar, I see the
following:
<DIV class="predictiveSuggestionDiv hideSuggestClass"
id="destinationSuggestionsDiv">
<DIV class="fieldText" spry:hover="highlight"
spry:suggest="Oak Harbor, WA">Oak Harbor, WA</DIV>
</DIV>
<IFRAME class="iframeSuggest" style="DISPLAY: none; LEFT:
0px; WIDTH: 245px; TOP: 20px; HEIGHT: 18px" src='javascript:"";'
frameBorder="0" scrolling="no"></IFRAME>
Which leads me to believe that the autosuggest is not
actually inside the iFrame. While I found the styles for the
iframe, and set them, I did not find a way to tell spry to use the
iFrame. I was thinking that this might be the missing link, but I'm
not sure.
I've tried setting the TabbedPanelTab &
TabbedPanelTabGroup to z-index: 1, however the tabbed panels seem
to really want to be above everything else anyway. I do have the
iFrameSuggest class and I set it as suggested in another forum
entry to:
.iframeSuggest
position: absolute;
z-index: 2002;
filter:alpha(opacity:0.1);
However, that does not seem to solve my problem in IE 6.
Any thoughts?

Problem: I am using the autoSuggest widget on the same page
as tabbed panels. In FireFox, it works GREAT! In IE6, I have a
problem with the suggestions being under the tabbed panels tabs
(possibly under the tabbed panel tab group)... I found a suggestion
which stated to set the autosuggest to z-index: 2002, and set it to
absolute positioning, both of which I've done.
When I look at the source using the IE Dev Toolbar, I see the
following:
<DIV class="predictiveSuggestionDiv hideSuggestClass"
id="destinationSuggestionsDiv">
<DIV class="fieldText" spry:hover="highlight"
spry:suggest="Oak Harbor, WA">Oak Harbor, WA</DIV>
</DIV>
<IFRAME class="iframeSuggest" style="DISPLAY: none; LEFT:
0px; WIDTH: 245px; TOP: 20px; HEIGHT: 18px" src='javascript:"";'
frameBorder="0" scrolling="no"></IFRAME>
Which leads me to believe that the autosuggest is not
actually inside the iFrame. While I found the styles for the
iframe, and set them, I did not find a way to tell spry to use the
iFrame. I was thinking that this might be the missing link, but I'm
not sure.
I've tried setting the TabbedPanelTab &
TabbedPanelTabGroup to z-index: 1, however the tabbed panels seem
to really want to be above everything else anyway. I do have the
iFrameSuggest class and I set it as suggested in another forum
entry to:
.iframeSuggest
position: absolute;
z-index: 2002;
filter:alpha(opacity:0.1);
However, that does not seem to solve my problem in IE 6.
Any thoughts?

Putting an icon in a Spry Tabbed Panels tab...

Hey everyone. I'm a beginner web designer working with Dreamweaver CS4 and having some issues with my spry tabbed panels. I am trying to place a small icon next to the label/title on one of the tabs. Unfortunately when I put the image in, it shows up below my tab's title as if there were a line break. I can't seem to get it on the same line as all of my tabs.
Here's a link to my test page: http://www.northpointindustries.com/Test/droppacker.htm
I'm using Cufon for the titles, in case that affects it...
Does anyone have any suggestions?
Thanks so much.

Try
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css">
<style>
ul.TabbedPanelsTabGroup li:nth-child(2) {
background: url(http://www.northpointindustries.com/Test/images/vidcam.png) left top no-repeat;
padding-left: 30px;
</style>
</head>
<body>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
    <li class="TabbedPanelsTab" tabindex="0">Tab 1</li>
    <li class="TabbedPanelsTab" tabindex="0">Tab 2</li>
</ul>
<div class="TabbedPanelsContentGroup">
    <div class="TabbedPanelsContent">Content 1</div>
    <div class="TabbedPanelsContent">Content 2</div>
</div>
</div>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
</body>
</html>.
Change the value for each respective tab
Gramps

How do I put an image in a spry tabbed panels tab

Hello All,
I am currently working on a site with Spry Tabbed Panels.
One thing I'm not sure how to do is to put an image in each of the selecting tabs. I've done it before and I've forgot. I also have a site with an example of what I would like to do.
http://emilymagnuson.com
The tabs on this site were created with images inside of them. And I would like to know how to do it. I would like to make it work so the image changes when you click, hover, and deselect.
Thank you.

To put an image in the foreground, add it to your HTML code:
<li class="TabbedPanelsTab" tabindex="0">
<div style="margin-top:9px;"><img src="your_image_here.jpg">Contact</div>
</li>
Nancy O.

Images in Spry Tabbed Panels Tabs

I am completely new to the Spry options in Dreamweaver and
need help customizing the Tabs in the Spry Tabbed Panel.
I would like to substitute the text in each tab for a
different image in each tab, and have each image change by using
behaviors, depending on the user actions (hover, select, etc.).
If you can provide samples of this, it will truly be
appreciated. Thanks

First add an ID to the tab as follows or similar
<h2 id="second">Tab 2</h2>
Then add a style rule to add a background image as follows or similar
.TabbedPanelsTab#second {
background:url(myImage.gif);
Gramps

Spry Tabbed Panels: Tabs

I'm experimenting with Spry Tabbed Panels. The problem I
couldn't work out is that how to get panel tabs stay on their
place. They seems to be jumping out (far right) when I click on
enter key while my cursor in the tab content area. This happens on
DW CS3 but displays correctly on browsers preview (site is local)?
I am inserting Spry Tabbed Panel in a simple styled div.
There are many styled divs/nested divs on the page.
I can insert non Spry items in a same div and style them
without problem but something seems to be different about Spry
Tabbed Panel?

I'm experimenting with Spry Tabbed Panels. The problem I
couldn't work out is that how to get panel tabs stay on their
place. They seems to be jumping out (far right) when I click on
enter key while my cursor in the tab content area. This happens on
DW CS3 but displays correctly on browsers preview (site is local)?
I am inserting Spry Tabbed Panel in a simple styled div.
There are many styled divs/nested divs on the page.
I can insert non Spry items in a same div and style them
without problem but something seems to be different about Spry
Tabbed Panel?

Missing History and Snapshot panels, not found in Window dropdown menu

Both my history and snapshot panels disappeared (LR5) suddenly, and neither appears in the Window>Panels dropdown menu.
This *may* have occurred when I was trying to bring up my target collection (command B). I must have accidentally hit some other key(s), because suddenly I was taken to the last folder I was in.
I'm afraid to close LR and reopen it, in case that makes the problem worse. I really want those panels back!

Folders should not appear in the Develop Module, this panel is in the Library module only
The folders didn't appear in the Library module.
But now I have clicked something else (and I don't think it's Wacom-related now) ... it was something in the Window dropdown menu, and once again, I get the folders back but the snapshots and history are gone! Aaarggh.

Remove halo around spry tabbed panels tab

I am using a spry tabbed panel on my page. In Safari, whem I click on a tab, the tab is surrounded by a halo. I assume this halo is some Safari default rendering. Anyone now how to get rid of this halo? I'm guessing it can be done with a css statement.
Thanks,
Patrick

One small note before your Ben's advice;
The effect you are talking about is called "outline" or "focus border". Its added by the browsers for accessibility reasons. It allows uses who navigate by keyboard see where they are on the page. If you remove this focus, your page will be less accessible for these users..

Unwanted browser borders around active tabbed panel tabs

I'm getting unwanted borders around the active tabs in my Spry tabbed panels that seem to be added by the browser. For example I'm geting a fuzzy caterpillar border in Safari. Does anyone know how to turn off this effect? Thanks

Its called "outline" or focus borders, its in the browser for accessibility reasons. So when users use keyboard navigation, they know where they are on the page. If don't want it. You can remove it by adding outline:none to the css selector that targets the tabs

Spry Tabbed Panel not showing correctly on Remote Server

Hi Folks,
Here is something that is bugging me since a few days and I can't find the error or the culprit; I have the same page on another domain on the remote server and that is showing correctly. I even checked with Win Merge and the files are completely identical. It has no errors and is showing correctly on the local server. It also shows correctly in Dreamweaver CS4 or when viewed as a web page in Firefox etc.
Link: http://www.venture-wilderness.com/services.php
Please have a look and let me know what is happening.
Thank you,
zabberwan

Hi zabberwan,
Please have a look and let me know what is happening.
My IE 8 show's me this (in snippets):
and this:
and here (http://www.venture-wilderness.com/) I can see this:
It seems to me, that all is ok!?
Hans-G.

How to disable a tabbed panel tab?

Hi,
I'm creating a web service, and dinamically I need to enable / disable a TabbedPanelsTab inside a TabbedPanelsTabGroup. How can I do that?
Thanks for your help!

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Untitled Document</title>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet">
</head>
<body>
<a href="#" onClick="hideTab2(); return false;">hide tab 2</a> - <a href="#" onClick="showTab2(); return false;">show tab 2</a>
<hr>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
    <li class="TabbedPanelsTab" tabindex="0">Tab 1</li>
    <li class="TabbedPanelsTab" tabindex="1">Tab 2</li>
</ul>
<div class="TabbedPanelsContentGroup">
    <div class="TabbedPanelsContent">Content 1</div>
    <div class="TabbedPanelsContent">Content 2</div>
</div>
</div>
<script src="SpryAssets/SpryTabbedPanels.js"></script>
<script src="SpryAssets/SpryDOMUtils.js"></script>
<script>
function hideTab2() {
    Spry.$$('li[tabindex="1"]').setStyle("visibility: hidden;")
function showTab2() {
    Spry.$$('li[tabindex="1"]').setStyle("visibility: visible;")
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
</body>
</html>
Gramps

FOLIO PANEL NOT SHOWING UP UNDER WINDOW MENU:

I have installed the D-Pub update and per Adobe's India support team [:-( ] I uninstalled the whole program and reinstalled it as they suggested - that did not help at all and was a complete waste of time. so does anyone know how to get the Folio panel to appear/function in the D-Pub workspace?

That means it is installed.
Windows > Workspace > Reset Digital Publishing
Here's what I see under the Window menu:

Tabbed Panels - Tab shows over a dropdown menu

Similar Messages

Maybe you are looking for