Accordian panel with a scroll?

I have a small area to drop this widget and want to customize
it to scroll in the panel area is this possible?
I could not find any rules that had scroll in the CSS file.
Here is the test page not done work in progress (temporary
site):
http://www.invisualtechnologies.com/springvalley/
Thanks,
Hugo

Try posting this on the Adobe Spry forum. You'll also want to
update your
version of Spry as I believe the newer versions have
progressed to a fairly
smooth animation. Yours is very, very choppy.
If you have a development budget you might want to have a
look at our
Accordion panel widget:
http://www.projectseven.com/products/tools/accordion/index.htm
And an example showing what I think it is you are looking
for:
http://www.projectseven.com/products/tools/accordion/tweaks/overflow/
Al Sparber - PVII
http://www.projectseven.com
Extending Dreamweaver - Nav Systems | Galleries | Widgets
Authors: "42nd Street: Mastering the Art of CSS Design"
"INVT" <[email protected]> wrote in message
news:fnj2vt$854$[email protected]..
>I have a small area to drop this widget and want to
customize it to scroll
>in
> the panel area is this possible?
>
> I could not find any rules that had scroll in the CSS
file.
>
> Here is the test page not done work in progress
(temporary site):
>
http://www.invisualtechnologies.com/springvalley/
>
> Thanks,
>
> Hugo
>

Similar Messages

Accordian panel with plus and minus signs to indicate state of panel

I want the text to show [+] next to the title of the panel when it is collapsed and [-] when it is expanded
just like http://www.reddit.com/r/indesign/comments/1jewqq/custom_kerning_applied_to_a_single_charac ter/
the comments on this page can be expanded or collapsed by clicking the plus or minus sign
how do i do this?

I've started filling the accordion with my content and the
cookie works fine. But I see some things I'd like to have changed
if possible?
a) When I load the page all accordion panels flips open at
the same time and they stay open until the page has loaded. It's
probably not visible in the demo because it's only a few bytes to
load there. After the page has loaded the cookied panel stays open
and the rest of the panels close. Is it possible to hide the
loading of the panels somehow? This is kinda messy right now.
b) I'd like to use the cookie to control the panels but only
during the current session. When a new session occurs I'd like to
start with all panels closed a) (or use the script that states
default panel). The standard accordion use a small script to set
the default open panel. I tried modifying this script but it looks
like the accordion is following the laws of the cookie and is now
ignoring this script.
Panel 4 set to be default (0, 1, 2, 3):
<script type="text/javascript">
var Accordion1 = new
Spry.Widget.Accordion.prototype("Accordion3");
</script>

Mobile site using an accordian panel with menu selections

I watched the adobe muse video here is the link http://tv.adobe.com/watch/creative-suite-podcast-designers/how-to-create-a-dynamic-sliding -menu-for-your-mobile-website-in-adobe-muse/
In the demo, when you preview it mobile site, the menu is not displayed and when you tap th emenu, the accordian menu displays and pushes all the content down and then when you close it, pushes it back up.
I created a similar test mobile site. But, when I preview it the menu always appear on start up and the content is not pushed down or up when the menu is activated or closed. I noticed that the options on the accordian widget in the video are different than in my MUSE which is V7.1 build 329. There is no close all initially check box. Instead I have an overlap item below check box.
So my question is what do I need to do to get this to work as per the video.
Thanks-Bryan

Hello,
I think there may be an issue in how your model/Accordion Menu was configured. What insert option are you using? Your destination should only be 'one' row OR 'one' column at the most.
Thanks,
AJ

Scrolling slow in a panel with 300 images

Hi,
I am using a panel which contains about 300 images (small icons).
I covered this panel with a scroller, and when scrolling, it's very slow.
when there are less images (about 50), it scrolls smoothly.
Any suggestions ?
<s:Panel id="src"
                               skinClass="SrcSkin"
                               dragEnter="trashDragEnterHandler(event);"
                               dragDrop="trashDragDropHandler(event);"
                               bottom="{bottomBar.height}" width="100%" >
                    <s:Scroller width="100%" height="100%" id="srcScroller" >
                              <s:Group width="100%" height="100%" id="aaa" verticalCenter="0">
                    ADDING 300 IMAGES HERE AT RUNTIME....
                                        <s:layout>
                                                  <s:TileLayout verticalGap="-50" horizontalGap="11" />
                                        </s:layout>
                              </s:Group>
                    </s:Scroller>
          </s:Panel>

Try using a list with itemrenderer for image. Scrolling performance will imporve as the list recycles its renderers.

I need a bookmarks sidebar with a scroll arrow.

Hello,
I need a bookmark setup like I had in IE. A side panel with a scroll arrow if possible.
I am running Windows 7 on a new computer with cable.
Any help will be appreciated.
Thank you,
Jim Franchetto

There is a Bookmarks Sidebar. The quickest way to display it is to press Ctrl+b (this also closes it). Note that if your cursor is in a text editor, Ctrl+b might be intercepted to bold text instead of opening the sidebar.
Does that work the way you would like it to work?

Need help with horizontal accordian panels

Hi,
I'm wondering how I would re-create a horizontal accordian panel set, such as the one used in this website link, "http://www.thecapriapts.com/".
When I insert a "spry accordian" panel set, the panels are stacked on top of each other. I guess you would consider that a "vertical" accordian. Is it possible to manipulate the CSS to have it display horizontally, like the link I attached? Or.. is this a common javascript that I sould look into?
As always, thanks for your help out there...
Chris

With spry, there are two different kinds you can use: horizontal and vertical. What you're looking at in that site is horizontal. Usually, it appears as rectangles placed next to each other with the spry flying out below. In DW, you can go to your CSS rules for your spry menu and change the width and height of your boxes in your spry, depending upon which rule you have selected. Play around with that and see if you can just manipulate the horizontal accordian spry to where the rectangles end up being tall and thin. This will make it difficult, however, to get the text on its side like you see in that site. I'm not sure how you would go about doing that. But I would suggest trying to play around with the values in your CSS styles panel on the right (this is me looking at CS5 mind you. I'm not sure what you're running.)
Either way, for times sake and also readability, might I respectfully suggest playing around with other sprys to see if any look more aesthetically pleasing for your site? It would also make it a lot simpler to tweak to your liking.

Scroll block panel with keyboard

Hello,
how can I scroll in the block panel with the keyboard?
When there is the need to move far, a block or a diagram in the block panel, it takes much time to scroll with the mouse when something is selected.
Is there any way to use the keyboard to scroll when the mouse has selected something and it cannot use the scrollbars?
Thank you.
Solved!
Go to Solution.

No. You can probably write some special code which will allow you to do this, but I don't know how nicely that will play with the selection either. If you want, you can look up LabVIEW scripting, but be aware that this is relatively advanced material. It's not hard, but it does require knowledge of how LV works.
More generally, if your code is so big that you need to move in such big jumps, it probably means that you have a problem. Breaking up code into smaller modules will prevent this problem and will also come with some additional advantages. You can try looking up some online courses and style guides to learn more about this.
Try to take over the world!

Accordian Panels: want all CLOSED

The Accordian panels I've installed are lower down in the page body, just high enough to begin to see without scrolling down. Would like visitors to immediately see there's a list of topics - having the first panel open to start with, defeats that goal.
Suggestions on how to have all accordian panels closed, initially?

Thanks Ben, but aside from the fact I never use Design View in Dreamweaver (shudder), more to the point I am building this page in Drupal CMS and therefore (after testing the "base model" locally) am implementing and refining the code directly inside a page editor in my Drupal website. Here's the precise code I've typed in for the 2nd Accordian panel:
<code>
<div class="AccordionPanel">
    <div class="AccordionPanelTabBG">
        <div class="AccordionPanelTab">MARKETING</div>
        </div>
        <div class="AccordionPanelContent">
        <br>
Asgard Forge works with the Client to identify a clear consensus of what that company is and does, and shapes this into its Brand: a focused, concise, consistent Message about the Company.<br>
<br/>
<img src=/web-design/web-design-company/sites/all/themes/af_marketing/images/nodes/arrow-bulle t.gif align=absmiddle /><span style="color:#800101">   WE'LL ASSIST IN REFINING YOUR GOALS</span><br>
You may already know this cold – and then again it may help you sharpen your company focus;<br/>
<img src=/web-design/web-design-company/sites/all/themes/af_marketing/images/nodes/arrow-bulle t.gif align=absmiddle /><span style="color:#800101">   IDENTIFY COMPANY STRENGTHS & ASSETS</span><br/>
<img src=/web-design/web-design-company/sites/all/themes/af_marketing/images/nodes/arrow-bulle t.gif align=absmiddle /><span style="color:#800101">   DEFINE THE COMPANY PERSONALITY</span><br/>
<img src=/web-design/web-design-company/sites/all/themes/af_marketing/images/nodes/arrow-bulle t.gif align=absmiddle /><span style="color:#800101">   BUILD YOUR ONLINE BRAND</span>
<br>
Just because your company isn’t Nike or Apple, doesn’t mean you can’t take full advantage of having a brand that’s <strong>quickly recognized</strong> and <strong>enduringly remembered</strong>.
<br/><br/>
</div>
</div>
</code>
Again, for quick reference:http://www.asgardforge.com/web-design/web-design-company/new-client
As you can see, I've placed only two BR tags at the end of content in order to leave abit of padding there manually - and note the syntax. When the page is viewed and you look at the page source, you see my 2 tags PLUS the 6 differently-syntaxed </br/> tags.
If however you know for certain it's not someting SPRY does in constructing Accordian panels (I'm sorry but I don't yet know what your use or affiliation with SPRY is), then I would have to conclude it's something that Drupal does. Your confirmation on this point would be appreciated.
NOTE: As you can see in the above example, I've wrapped the AccordianPanelTab container inside another in order to maintain the Tab background all the way across while the + / - image to the left changes with toggle clicks. That's the only place I've diverged from the standard Accordian structure, and here's the CSS for that container:
.AccordionPanelTabBG {
    background-image:url(SpryAssets/bg-accordian-panel.gif); background-repeat:repeat-x; background-position:top;
    line-height:27px;
    border-left:1px solid #ccc; border-right:1px solid #ccc;
    margin: 0px;

Loading in a second Actions panel with the same functionality as the first, but independent from it

The actions panel is perfect at what it does; however, if you have a few action sets and, in order to eliminate scrolling, you need to expand them into a double row of buttons, it quickly becomes difficult to maintain. As soon as you delete an action or add an action to it, it disorders the others and you have to reorganize again, which becomes a vicious cycle. I like to keep things organised and neat with all that I do and pretty much the only way to have this feature is to expand it on the back end of the software or, if possible, create a script that loads a second Actions panel with the same functionality as the first but completely independent from it. I assume that the SDK will not allow us to expand on the software in this particular way, as Photoshop is not open source; however, maybe this suggestion will be taken into account for future updates or versions since I have yet to find a suitable way to do this.
Thank you in advance.
Kind regards

That would depend on the links on the page. Some pages have links that refer to different areas on the same page. If you want to force a link to open in a new tab, you can middle-click it.

Question about Panel,toolbar and scrolling

I have Panel that contains a ControlBar at the top, and a DataGrid that takes up most of the space. All good.
However. When the Panel scrollbars appear. It scrolls not only the grid, but, also the ControlBar.
Is there a way to prevent the panel from scrolling the ControlBar as well.
Thanks.

A Panel ControlBar has to be the last child to be treated as a controlbar and not be part of the scrollable content.
I would put a VBox in the Panel with the ControlBar first and Canvas with the DataGrid second. Set minHeight=0 on the Canvas
Alex Harui
Flex SDK Developer
Adobe Systems Inc.
Blog: http://blogs.adobe.com/aharui

JTable Blank Rows When INSERT/DELETE in other panel with same ViewObject

Hi,
Jdev 10.1.2
JClient
2 panels based on same ViewObject in same AM
One panel with Grid UI => JTable
Other panel with Form UI
When I insert or delete a record in the panel with Form UI and return to the panel with JTable blank rows are displayed.
The problem remains even after commiting before returning to JTable panel.
When I activate the execute button in the JTable panel, the display is OK but the currency is lost.
I suppose calling the refresh method when returning to the JTable panel should solve the problem.
Can you please suggest me a server-side/model workaround:
refresh (which option to use ??)
Thanks
Frederic
PS I tried the workaround of thread 10.1.2 JClient binding Error. but that doesn't help.

Same problem with default wizard generated Master-Detail Form.
When in the detail more then 10 rows exist, the scrollbar shows that not all rows are displayed.
If I use the scrollbar to view the last rows they are blank, in order to display them I must activate the next button one time for each additional row.
The workaround is to enter -1 in the range size of the iterator.
But what if the range size is 10.
Is the blank rows display a bug?
OR
Must the scrolling area (size of JScrollPane) be defined according to the range size of the iterator?
If the latter is true:
Can somebody give me some clues on which attributes of the JScrollPane must be set (PreferredSize, MinimumSize ??) and on how to calculate this area: total width & total height if the row height for the table is set to 20?
Your help will be appreciated
Frederic

Re: Spry Accordian Panels

Hi. I used Spry Accordian Panels in a new website I created using Dreamweaver CS6. Most people can see and click the panel to open it and see the content in it. However, I know someone that's blind that would like to use the site but is having a lot of trouble with it. The panel tabs are not links so it doesn't tell him to click it. I've tried putting the tabindex attribute on each panel tab and the aria-polite:polite but it hasn't helped. Any ideas?

Hi. I used Spry Accordian Panels in a new website I created using Dreamweaver CS6. Most people can see and click the panel to open it and see the content in it. However, I know someone that's blind that would like to use the site but is having a lot of trouble with it. The panel tabs are not links so it doesn't tell him to click it. I've tried putting the tabindex attribute on each panel tab and the aria-polite:polite but it hasn't helped. Any ideas?

Tabbed panel with adjustable/variable height based on content

Is there anyway that you can create a tabbed panel with adjustable/variable height based on content in each tab?

Abhishek,
Thanks for your reply, however, it is not working with Muse. I added the Javascript to the head section and adjusted iframe and it displays as a small square in the upper left hand corner, unable to view the whole page.
Inserted into head section --
<script type="text/javascript">
function resizeIframe(obj)
obj.style.height = 0;
obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
</script>
inserted as an html object --
<iframe name="MycoSmooth" src="http://www.mycosmooth.com" frameborder="0" scrolling="no" id="iframe" onload='javascript:resizeIframe(this);' />
Below is the result:
The purpose is to have an independent website run the blogging capabilities, since muse doesn't directly support blogging as of yet.
Since the site is on a different domain, I am running into cross domain issues and it won't get the height of the page. The methods that apparently work use php and I am unsure how that would work in muse, if at all.

MENU's are coming with the scroll bar

Hi,
I have a problem like this, I am migrating one menu file from a forms6i to 10G after that i tried to put that menu in the form then i found that the menus are coming with the scroll bar is there any parameter so that i can set that to false so i can see all the menus at one time.
Thanks in advance.
Saravanan.K

below is my code.
Display will have some graphics, the mouse click on the part of the graphics will produce different values in the table. class DatabaseDataDisplay has the JTable who display the values.
Display.addMouseListener(new MouseAdapter()
{ public void mousePressed(MouseEvent evt)
//get the location of the mouse
          int x = evt.getX();
          int y = evt.getY();
          current = find(x, y);
if(current!=-1)
DatabaseDataDisplay D_Display=new DatabaseDataDisplay(Table_Name, current);
                                   //remove the old panel
                    WholePanel.remove(scrollPane5);
          //add the new DataPanel
JScrollPane scrollPane5 = new JScrollPane(D_Display,
JScrollPane.VERTICAL_SCROLLBAR_ALWAYS,
JScrollPane.HORIZONTAL_SCROLLBAR_ALWAYS);
WholePanel.add(scrollPane5, new GridBagConstraints(0, 1, 1, 1, 1.0, 1.0,GridBagConstraints.CENTER, GridBagConstraints.BOTH, new Insets(0, 2, 0, 2), 659, 5));
/*if I put a repaint() here, the value on the table will always the values of the first time values when I click the mouse*/
WholePanel.validate();

Link to specific accordian panel

Hi there,
I'm currently using the Spry Accordian feature (with 4 panels) on an internal page of a site I'm building. I have a requirement to place 4 links on the homepage that take me to this internal page and open specific panels, ie. one link would take you to the page with panel 3 open, while another would take you to the page with panel 4 open.
Any advice on how I can achieve this would be greatly appreciated.
Kind regards
Paul

Read: foundationphp.com/tutorials/spry_url_utils.php

Accordian panel with a scroll?

Similar Messages

Maybe you are looking for