Adding a scroll bar to tabbed panel content?

I have set a specific height to tabbed panels and I don't
want them to expand according to content. Instead I want to add a
scroll bar to the tabbed panels. How can i do this?

Sure it's possible.
Edit the TabbedPanelsContent class in the CSS file.
Add a specific height to it and then add an overflow:auto;
rule to it.
.TabbedPanelsContent {
padding: 4px;
overflow: auto;
height: 200px;
When styling Spry Widgets, for the most part, just think of
them as HTML. Add a height and a scrollbar just as you would to any
DIV.
Hope this helps,
Don

Similar Messages

  • Removing scroll bar from Nav Panel & Work Area layout

    Hi Guys,
    I have a requirement to remove the scroll bar which appears between nav panel and Work Area in 'Nav Panel and work area layout'.
    I would like it to be as a single page as we get in narrow: wide layout.
    Well I could just do it by using a narrow:wide layout, but the challenge is I also need the collapse/expand Icon which we get in Nav Panel/WA layout.
    I am looking fcor help with either
    1. Removing the scroll bar from Nav Panel/WA layout
    Or
    2. Adding collapse/expand  icon to narrow:wide layout.
    Thanks,
    Yomesh

    Hi Yomesh ,
    If you want to enable the expand/collapse icon , then you can set the property named Show Tray of the page to yes and then test . By default the property meant for showing the expand/collapse icon is set to yes . You only need to enable the tray and check .
    I did not get the requirement that you have with respect to scrollbar . Where is that scrollbar appearing that you want to remove?
    Regards
    Mayank

  • How to add scroll bars to a panel

    Hi
    Can anyone plz tell me how to add a scroll bar to a panel created within a JFrame
    Regards
    ats

    import javax.swing.*;
    import java.awt.*;
    class Testing extends JFrame
      public Testing()
        setLocation(300,200);
        setDefaultCloseOperation(EXIT_ON_CLOSE);
        JPanel jp = new JPanel();
        jp.add(new JLabel("Label on a panel"));
        jp.setPreferredSize(new Dimension(200,300));
        JScrollPane sp = new JScrollPane(jp);
        sp.setPreferredSize(new Dimension(200,200));
        getContentPane().add(sp);
        pack();
      public static void main(String args[]){new Testing().setVisible(true);}
    }

  • Anchor tag inside Spry Tabbed Panel Content

    I have successful been able to use code I found listed on
    here to open a specific tab in a Spry Tabbed Panel form a link. Now
    I am wondering if anyone has found out how to add an anchor tag
    code this so that is goes to a specific location inside that Tabbed
    Panel Content?

    I was looking for an answer on how to open a tab from another tab and found it!
    In return I'll give you a hint on how to open a tab from another tab using an anchor
    for example,
    if you were working on a file named "projects.php"
    create an anchor in tab 2
    <a name="anchor1" id="anchor1"></a>come next to me
    in tab 1 create the link to the anchor in tab 2
    <a href="projects.php#anchor1" onclick="TabbedPanels1.showPanel(1); return false;">open tab 2 and go to its anchor 1</a>
    In your case you are overlooking the file name and jumping directly to the anchor name.....am I right??
    cheers from Lima, Perú

  • Vertical scroll bar on tab page.

    Hello,
    I have to show vertical scrollbar on my tab canvas.
    I have one Content canvas on which I have 1 tab canvas with 8 tab pages.(sec1,sec2,sec3 ..sec8)
    I have another tab canvas(kind of seb section for the above and each has 3 tab pages) like
    Sec1 will have (sub sectiion tab canvas) which has again 3 tab pages 1.1,1.2,1.3 and soon
    now on the third tab page of the sub section or second tab canvas, I need vertical scroll bar to fit number of fields which are more than the tab canvas size.
    all are from the same data block
    Could you please help me. i tried by creating staked canvas but no luck.
    can you please let me know the procedure to be followed
    Thank you in advance.

    Could you please help me. i tried by creating staked canvas but no luck.What happened when you tried to use a stacked canvas?
    If the items in the area you want to scroll are all in the same datablock you can set the Scrollbar properties of the block to be displayed. This will enable scrolling of the items that are within the specific block. If you items are assembled from more than block, then using a stacked canvas is a better option for enabling scrolling within an area.
    Also, what is your Forms version?
    Craig...

  • Scroll bar in tab canvas

    hi guys
    iam developing a custom form using forms 6i
    this is my prob i have a content canvas and a tab canvas in my window i have abt 20 col in my one of tab and i want to use a scroll bar in one tab how can i get it can any one help me urgent
    ravi

    Well, you are kind of out of luck: no horizontal scrollbar for tab canvases.
    Still, here's what I did to solve this problem:
    - I make a stacked canvas that would display above the tab-canvas, having an horizontal scrollbar
    - on the when-tab-page-changed I write the code needed to get to show/hide the stacked canvas, depending on which tab activates.
    It's not so simple, still this works.
    If anyone has a better solution without using java beans or some other complications, I'd really like to know how.

  • Make the height of a tabbed panel content container adjust to the individual tab's content.

    I am designing a site and on one page I am using two tabs to seperate two different kinds of content.  One tab has more content and as such is longer on the page. But I noticed that MUSE uses which ever tab is the longest as the basis for how long the page is. This is fine while on that tab, but on the other tab it makes the page much longer (bunch of dead space) then it needs to be.  Is there a way of getting around this or is this a limitation of muse?
    Take a look at the page here and you will see what I mean. Click on cuff cases and scroll down and you will see what I mean.
    http://pgl0.businesscatalyst.com/accessories---prince-gun-leather.html

    Hi Lukewind,
    This has come up in the forum archive. There is not currently a way to create a tabbed panel with adjustable/variable height content containers. This is not actually a bug in Muse, but it is a feature request. Please create an Idea topic for this feature in the Ideas for Features in Adobe Muse forum (http://forums.adobe.com/community/muse/ideas).
    Here is the content from the archive request:
    Have the depth of tabbed panels adjust to the size of the content.
    The boxes in tabbed panels should be adjustable to the content rather than have all the tabs open in the same size as the biggest text box.

  • Spry Tabbed Panel Content editable region not functioning

    I have a web page I created in dreamweaver CS5 with a tabbed panel.  When my client opens the page to edit in contibute, the content and tabs do not function properly.  Basically, the tabs do not function and the content for all of the tabbed regions is listed down the page on the first tab window. The page works fine when I open in Contibute on my computer, but only if it is through the Contibute Program.  If I try to edit through firefox, I get the same issue as my client. 
    http://menwieldingfire.com.previewdns.com/bbq/bbq-menu.html
    also, I get a space between the header image and the horizontal menu that goes white.  I end up having to re-upload the page from dreamweaver. Why would the follow code get added to the page when a draft is created in Contribute, when this page is based on a template with editable regions?
    < p style="margin-top: 0; margin-bottom: 0;">&nbsp;</p >
    Any ideas?

    Check http://blogs.adobe.com/contribute/2010/06/paragraph_spacing_options_in_a.html  and also http://blogs.adobe.com/contribute/2010/06/spry_widget_rendering.html it should be helpful to resolve the issue.

  • Dividing Spry Tabbed Panels content area into columns?

    Hi there.
    I am building a website and I want to divide the content area of a Spry Tabbed Panel into 3 columns for text.
    How can I do this?
    I thought about making divs inside the Panel but it would be too messy.
    Please let me know if there is a simple way to do this.
    Thanks in advance.

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Untitled Document</title>
    <script src="SpryAssets/SpryTabbedPanels.js"></script>
    <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet">
    <style>
    * {box-sizing: border-box;}
    body {width: 960px; margin: auto;}
    .TabbedPanelsContentVisible {overflow: auto;}
    .col33 {width: 33.3333%; float: left; padding: 15px;}
    </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">
            <div class="col33">
              <h3>Column 1</h3>
            <p>Content 1</p>
            <p>Dicta sunt explicabo. Nisi ut aliquid ex ea commodi consequatur? Neque porro quisquam est, aut odit aut fugit, ut aut reiciendis voluptatibus maiores alias. Iste natus error sit voluptatem dicta sunt explicabo. Sed quia consequuntur magni dolores eos itaque earum rerum hic tenetur a sapiente delectus, cum soluta nobis est eligendi optio. Omnis voluptas assumenda est, nemo enim ipsam voluptatem neque porro quisquam est.</p>
            <p>Eaque ipsa quae ab illo inventore veritatis totam rem aperiam, qui ratione voluptatem sequi nesciunt. Consectetur, adipisci velit, aut odit aut fugit, ut enim ad minima veniam. Id est laborum et dolorum fuga. Atque corrupti quos dolores et quas molestias qui ratione voluptatem sequi nesciunt. Temporibus autem quibusdam saepe eveniet ut et voluptates repudiandae sint sed quia non numquam eius modi.</p>
          </div>
            <div class="col33">
              <h3>Column 2</h3>
            <p>Content 1</p>
            <p>It is the star to every wand'ring bark, which alters when it alteration finds, love alters not with his brief hours and weeks. Or bends with the remover to remove. That looks on tempests and is never shaken; admit impediments; love is not love let me not to the marriage of true minds.</p>
          </div>
            <div class="col33">
              <h3>Column 3</h3>
            <p>Content 1</p>
            <p>The three cs - customers, competition and change - have created a new world for business while those at the coal face don't have sufficient view of the overall goals. In order to build a shared view of what can be improved, building a dynamic relationship between the main players. Highly motivated participants contributing to a valued-added outcome.</p>
            <p>Whether the organization's core competences are fully in line, given market realities the components and priorities for the change program an important ingredient of business process reengineering. Taking full cognizance of organizational learning parameters and principles, organizations capable of double-loop learning, working through a top-down, bottom-up approach. In order to build a shared view of what can be improved, maximization of shareholder wealth through separation of ownership from management measure the process, not the people. Presentation of the process flow should culminate in idea generation, taking full cognizance of organizational learning parameters and principles, the components and priorities for the change program. An investment program where cash flows exactly match shareholders' preferred time patterns of consumption from binary cause and effect to complex patterns, working through a top-down, bottom-up approach.</p>
          </div>
        </div>
        <div class="TabbedPanelsContent">Content 2</div>
      </div>
    </div>
    <script>
    var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
    </script>
    </body>
    </html>

  • How to get rid of scroll bars in sub panels when displaying a VI which is part of a class?

    I am writing an application that applies different analyses to a set of data. The program must be flexible configurable. To not clutter the GUI with too much elements I ended up with the idea to load the needed user interfaces for each specific analysis dynamically into a single sub panel when needed. This works well without any problem.
    Due to the fact that all analyses share some common functionality I have decided to use LabVIEW classes for implementation. Each class has one VI representing the user interface to show in the sub panel.
    This works also well BUT the sub panel always shows a horizontal and vertical scroll bar I don't want to see!
    I have already learned that I need to change the user interface VI to a custom "Window Appearance" and disable the "Show scroll bar" properties. But this seems to work only for "normal" VIs but not for VIs that are part of a class.
    Any ideas?
    Ingo
    Solved!
    Go to Solution.

    Thanks Pixar, this was the right tip!
    Although: there seems to be a difference between "normal" VIs and VIs that are members of a class.
    For "normal" VIs it is sufficient to set the property to "Off While Running" and it works as expected.
    VIs part of a class need the "Always Off" setting" which is only accessible via right click on the scroll bars but not via the VI's properties box.
    Thanks and Regards
    Ingo

  • Scroll bars in tab canvases

    How to enable scroll bars in a tab canvas in order to scroll through the tab canvas using forms 6i
    kamal Mukhtar

    Thanks!
    I found the setting for "Show Scroll Bars."  However, I can't find the setting for the scroll-bar width.  How do I adjust scroll-bar width?

  • Scroll bar and tab bar turn to images, images on a page repeat themselves

    I don't know exactly how to explain my problem so I'll just give some examples.
    - On youtube, video thumbnails copy themselves on top of the other video thumbnails, and sometimes I can see 2 or 3 same thumbnail, but when I hover the cursor above them they return to normal. The names or video links are unaffected, just the thumbnail.
    - On facebook and some other forums, same problem exists. One thing I noticed, it doesn't affect huge files, as in it doesn't replace huge images but copies something like 200x200 image to some other place.
    - Some of the tabs in tab bar and scroll bar sometimes turn into diagonal patterns, and scroll bar sometimes has the same problem I gave as example above. The grey default layer turns into an image. But hovering the cursor above it returns it to normal again.
    Any help is appreciated.

    Hi, thanks a lot for the support. I've found the solution!
    I've checked all of the installed programs on my system. All programs are from verified publishers.
    Actual problem was with graphic drivers. My laptop is Sony Vaio and therefore I had the recommended latest drivers (for my graphic card) available from Sony website installed. The graphic card is from NVIDIA GeForce. So, don't know why but I uninstalled all graphic drivers from the system and downloaded the latest drivers available for my graphic card hardware from NVIDIA website. Now the new latest drivers from NVIDIA solved the problem !!! Firefox is working perfect. No problem on any website.
    May be the same can work for other Firefox users also having this problem. No need to disable "hardware acceleration when available" in Firefox.
    Happy !!!! :D :D

  • Scroll bar in Table of Contents on iPad

    The Table of Contents in my project is pretty long. However, when played on an iPad there is no scroll bar to indicate that there are more slides than what is initially seen in the Table of Contents (although you can still scrub through the Table of Contents). Is there a way to add a scroll bar to make it more obvious?

    Hello,
    Welcome to Adobe Forums
    Do you have a MAC or Windows?
    Which version of Adobe Captivate are you using?
    Do you reproduce this issue on a blank project?
    Any possiblity to share you project on [email protected]
    Thanks,
    Vikram
    Adobe Support

  • Tabbed Panel content overflow problem

    Hi everyone,
    I'm a newbie to this, but have successfully used a few Spry
    elements and am loving them.
    My problem right now is that I'm trying to get a tabbed panel
    to work where the panel contents have different amounts of text. It
    works great in IE6 and looks fantastic, but in IE7 and Firefox 2
    the content is visible although it overflows beneath the styled
    content area.
    You can see it here:
    http://www.pranayogacollege.com/yoga-workshops.php
    I imagine it's a simple thing that I've overlooked, but I'd
    be very appreciative if someone could point me in the right
    direction.
    Thanks in advance,
    Jade

    "spiderjade" <[email protected]> wrote in
    message
    news:eqt5mt$d32$[email protected]..
    > You can see it here:
    >
    http://www.pranayogacollege.com/yoga-workshops.php
    >
    > I imagine it's a simple thing that I've overlooked, but
    I'd be very
    > appreciative if someone could point me in the right
    direction.
    .TabbedPanelsContent {
    padding: 4px;
    /*ADD NEW*/
    height: 276px;
    overflow: auto;
    Al Sparber - PVII
    http://www.projectseven.com
    Extending Dreamweaver - Nav Systems | Galleries | Widgets
    Authors: "42nd Street: Mastering the Art of CSS Design"

  • Anchor Tag In Tabbed Panel Content

    I used this code to jump to and open the tab. I would like to
    add an anchor tag name to it so that it jumps to a specific section
    I have named in the content panel.
    <a href="#" onclick="TabbedPanels1.showPanel(2); return
    false;">
    This solution does not work:
    <a href="#anchorname" onclick="TabbedPanels1.showPanel(2);
    return false;">
    Has anyone found a work around for this?

    This is such a great solution--thanks so much for sharing.  I'm having a problem with the name of my collapsible panels (which operate similarly to Tabbed Panels, as far as I understand).  Basically I am trying to use anchor tags and my goal is to create a hyperlink on page 1 that points to content within a spry widget on page 2 of my webpage.  I obviously want the spry widget on page 2 to open up on click and the user to be taken to where my anchor tag is located.  In this thread (http://forums.adobe.com/message/209107#209107), Mr. Celic seems to indicate using something like this:
    <a href="#anchorname" onclick="TabbedPanels1.showPanel(2);">
    My exact code is like this:     <a href="pagetwo.html#myanchortag" onclick="CollapsiblePanel1.open();">content here</a>
    The good news is that this works, but my problem is that page 1 of my website also has a CollapsiblePanel1 so when I click on the link above, CollapsiblePanel1 on page 1 opens, not the CollapsiblePanel1 on page 2 of my site.  I went into page 2 and clicked on "CollapsiblePanel1" and in the "Properties" panel renamed it to "CollapsiblePanel11" then changed my code to
    <a href="pagetwo.html#myanchortag" onclick="CollapsiblePanel11.open();">content here</a>
    but that didn't do a thing!  I'm super stuck and don't know how else to rename the collapsible panels or how to get it to work.
    One thing I can't figure out from the original solution (<a href="#" onclick="TabbedPanels1.showPanel(2);">) is what is "showPanel(2)"? Where did she get this from/where can I find the equivalent for my collapsible panel spry? This could be where I'm going wrong.
    Any thoughts would be greatly appreciated.
    Thanks so much! Catherine

Maybe you are looking for