Screen wide accordion widget content being shifted

Hi There,
I'm developing a site where screen wide accordions are used to reveal more content. See it here: http://stielendef.businesscatalyst.com/ Problem is that when one clicks the black and white image the content within the accordion itself (the image of the booklet) is moved left. It should just be centered in the accordion, that's also how it looks in design mode. Hope to see a prompt reaction beacuse this is driving me insane!
P.S. There are lot of things not completly right about the website in the link, but for now i'm focusing on solving the problem with the shifting content within the accordeon.

Have you tried the examples shown at the "Hiding Data
References" page:
http://labs.adobe.com/technologies/spry/samples/data_region/HideDataReferencesSample.html
The .SpryHiddenRegion method seems to work for my
accordion.

Similar Messages

  • Need to hide Accordion Widget Content until after pageload

    Hi,
    I was wondering if anyone had any experience in hiding the
    content of the accordion widget panels until after the page loads.
    I am fairly new to these libraries so I am fairly inexperienced on
    how to go about a fix for this sort of issue. I have the widget
    working fine, the only problem that I am having with the accordion
    widget is that I do not like the way the accordion widget gets
    loaded to the browser while the screen is loading, it looks clunky
    and unprofessional.
    Would anyone have any good ideas on how I go about correcting
    this issue? Any help or suggestion is much appreciated.
    Thanks
    DB

    Have you tried the examples shown at the "Hiding Data
    References" page:
    http://labs.adobe.com/technologies/spry/samples/data_region/HideDataReferencesSample.html
    The .SpryHiddenRegion method seems to work for my
    accordion.

  • Accordion widget content height

    I'm using an accordion widget for the navigation of a site.  Some of the sections have sub-sections and other do not.
    Is it possible to remove the "content area" of an accordion widget but keep the label?  I tried to set the height of the content area to "0" so the items below would not shift down but it appears that the minimum height for the content area is 1 pixel.
    The page is posted at http://ekagra.com/dev/
    If you click the 'Services' or 'Clients/Partners' links, you'll see the other labels shift down.

    Thanks for the quick reply. I'm using spry pre-release 1.6 in
    CS3 so maybe it's set up different. When I drop the spry accordian
    widget into my html it creates a css and js file to go with it. I
    found that if I edit the js file to read
    FixedPanelHeights = false;
    that the panel will resize for the content. If left to the
    default, true, the panel will have a scroll bar to the side for
    overflow, which I don't like. Then with it set to false, I can
    adjust all the rest thru the css file. Again, I'm a newbie when it
    comes to this stuff so I'm proable doing something backwards, but
    this seems to work. Thanks again.
    Tommy

  • What happened to Accordion widget 'shifting' content downwards?

    With the new CC Muse upgrade, did the feature where the accordion content area would "shift" the entire contents underneath downward disappear? I see now that it only overlays any content on the page... am I missing something?

    Hello,
    Please check in Accordion Widget properties if the "Overlap Items below" option is checked or not?
    If it is checked, please uncheck it and it should  resolve the issue.
    Screenshot : http://trainingwebcom.worldsecuresystems.com/SachinFTP/2013-06-20_2130.png
    Regards,
    Sachin

  • All time Bug! Accordion widget does not retain content position as in design view

    I have noticed that content placed inside an accordion widget that is stretched to fill browser width do not retain the position of its elements. This is very annoying as ones layout does not look right and balanced across screen.

    That was it KathH --- THANKS!!!
    Had created the row w/out <td> cells to carry the top banner (sort of cheating) on spanning the cells i guess ( )
    Anyway, re-wrote so that the banner table was independant and did not require span and picked up the data table independantly.
    Problem solved and designer picked up the image precisely.
    Thanks again!!!
    Curious though that the image is dependant on the <td> tag.  I would have expected any image called within the page to display in the designer regardless of location in the html.
    Oh well, fixed and onto the next challenge.
    Once more THANKS!!!

  • Text Shift Uncontrollably Inside Accordion Widget

    Guys hi! I've been crashing my head for two days with this. Hope you will provide some help!
    I have an Accordion Widget with a very long text block inside one of the boxes (a list with over 80 lines). On the background to each second line I put a grey rectange shape just to give some contrast to the lines in the list. In the project all the rectangles are prefectly aligned to be right behind the lines. But when I publish the site I definately see that the rectangles shift up or down.
    Is it a bug and the widget simply cannon handle correctly so many elements insie the feiled or am i missing something here?
    Many thanks in advance for your advice!! You might be saving me from insanity here;)
    UPDATE!! It was not the shapes but the text that was shifting. I fave some items on the list that consists of two lines. That's where I changed the leading betwin those two lines from 200% (for separate items in the list) to 146% between two lines (for the items that cosist of two lines of the text). That somehow couses the text to shift in the preview mode xompared to the design mode. When I make the leading unilateral throghout the entire textbox everything stands in place.
    Still the problem remains unsolved.

    Zak. thank you very much!
    And sorry for coming back so late on this.
    You solution perfectly solved the problem.
    On the downside,) I did have to change the layout and reformat the site to submit it to the client because the deadline came before I got your reply.
    Perhaps the "Round Leading to a Whole Number" setting should be checked by default to avoid this kind of problems for other users in the future.
    Anyway, a million thanks!

  • Accordion widget not pushing content out of way

    Hi,
    Following a Lynda.com tutorial I added a menu to an accordion widget while designing a mobile site.  Expanding the accordion is supposed to push the page's content downwards but it is simply unfurling over it.  Does anybody have any idea what might be going wrong?
    Thanks,
    Peter

    Check to make sure "Overlap Items Below" is not marked.

  • Accordion widget not pushing content down

    I followed the instructions for putting the menu inside the accordion widget. It has worked great for me in the past. But now, the menu just shows up behind the content. I've looked at several discussions, and I have everything set up correctly. No scroll effects, etc. I followed the step-by-step instructions on Lynda.com and in an earlier version of Muse it was perfect. Now it isn't. Here is the business catalyst site URL.  pitv.businesscatalyst.com. Appreciate your help.
    Carole

    Hi,
    Coud you please try the suggestion provided in the following thread
    Re: Accordion Widget is Not Moving Other Page Items Down When Expanded
    Do let me know if you have any question.

  • Content below Accordion widget not moving?

    I want to have content below the accordion widget to slide down when one of the panels is open.  Right now the accordion widget slides behind the content when one of the panels is open. I have "Overlap Items Below" checked.
    From the Lynda.com site: " The Accordion panel now includes an option to Overlap Items Below. When selected, content below the Accordion panel will move down on the page as an Accordion panel is opened/expanded."
    thanks

    That seems like a typographical omission on Lynda.com's blog.
    You need to uncheck that option to move the content below accordion down upon opening the panel.
    Please check below excerpt from Muse Release Notes here: http://helpx.adobe.com/muse/release-note/adobe-muse-release-notes.html
    The Accordion panel now includes an option to "Overlap Items Below". When selected content below the Accordion panel will not move down on the page as an Accordion panel is opened/expanded.
    Cheers,
    Vikas

  • Spry accordion widget - SSI (server side include) as content in the panel

    After having inserted the following command <!--# include file = "content2.asp" -> in the accordion Panel Content I get an error in Dreamweaver - every time I open the file. See the error in the attached picture.
    Once all files are uploaded to the server it works apparently without problems or script errors.
    Is there anyone who can help me to use SSI "server side include" as content in accordion panels?

    Thanks for your reply.
    The fault lay in the SSI file. This file contained these tag:
    </ html>
    And of course the tag </ html> generate an error if the tag is inserted in the content of the accordion panel via ssi file.

  • Accordion widget and audio

    Using CP 7, I am trying the accordion widget for the first time, and I have it working rather nicely.  Then I added audio to each of the options, to accompany the text that is revealed when the option is chosen, so that as each option is selected, and its text appears, the specific audio would play.  That makes sense and that is how I would expect it to work.  However, as soon as the screen loads one audio plays, and none of the audio clips play when their option is chosen.
    Is this really the way it works?  I would expect no audio until the user clicks one of the options, and then that audio would play.  The way it is working for me makes no sense.  Why have an audio icon for each content area (under each accordion option) if they don't play when the user opens that option?
    As I created content for each of the options, I added an audio clip, using the audio icon specific to each accordion option.  But it appears that only one audio is being used for the entire accordion.
    I read through the string about problems with audio and the accordion, but that issue was different from this.
    The way this is working now is not acceptable, and I will need to throw away everything I have done so far and start over if I can't make this work.

    I just tried it in Windows with exactly the same behavior.
    Can someone confirm how this is supposed to work?  Logically, when a user selects one of the accordion options, and the option expands to show the text within it, then the associated audio should play.  In the image below, you see the audio icon associated with the content for one option.  However, in the documentation I found it is very vague about what the audio is assicated with.  If the audio is just associated with the entire object, then the interface below is misleading at best.

  • Accordion Widget functionality

    Hello. I need the accordion widget to activate on mouse over instead of mouse click. Is this possible? If not, is this a feature that will be added in the future?

    Thanks for the response Kin!
    I am setting up the links like you suggested, placing the
    link inside the AccordionPanelTab, however, the problem isn't
    getting the link to intercept the clicks, it's getting the link to
    perform their default action. In the SpryAccordion.js file, on line
    223, the default action of the tab's contents is being disabled.
    This means that, regardless of whether or not there is a link
    inside the tab, it will still act only as a tab (unless I'm missing
    something). The code looks like this:
    if (e.preventDefault) e.preventDefault();
    If one adds:
    e.preventDefault = false;
    before the code on line 223, the problem is solved. The
    problem with that solution is, if I go in and add that line of
    code, I have to remember that change and where it was for all
    future updates of the Spry widgets. So my question is, is there a
    way to disable preventDefault so that default actions of, in this
    case, links are enabled? Can this be done without editing the
    Accordion Widget's Javascript file?

  • Can I set my accordion widget to "expand all" tabs?

    I am using an accordion widget to display content on my web page. Is there a way to allow the user to "expand all" of the accordion tabs at once?

    One way you can achieve this is by creating single panel accordion files, just copy the file down for each section, make sure to set the accordion setting to "Can close all".
    See attached screen shot when published.... the panels are all closed, but you can open all to view.

  • Mobile Site - Need Accordion Widget to start at top of page upon item selection

    I have set up a mobile site.  I use the accordion widget for topics.  If I select any topic without diving into it and scrolling, it works fine.  If I scroll through a topic after selection, the next topic starts in the middle or the bottom.  Kind of annoying for the user.  Any ideas?
    Thanks

    Hi Kevin,
    Could you please share the site URL or any screen shot for reference?
    Regards,
    Neha

  • SPRY accordion widget IE8 ONLY issue

    hello everybody,
    i noticed a strange "jumpy" behavior while using the spry accordion widget -- this affects IE8 only (currently using 8.0.6001.18882 on vista), other browsers (including IE7 and IE8 forced into IE7 mode) work as expected. this issue seems to be related to the margin property of the accordion container...
    not shure whether this behavior is related to IE rendering or the spry javascript code itself... anyway i made NO changes to the spry script (my version is 0.15, 1.6.1, which i believe to be most recent one).
    the xhtml (strict) and css are perfectly valid (there might be some MINOR css hacks which are not related to the accordion itself). i do NOT use ANY padding on the inner container of the accordion (which would definetely make the spry js count the tween in odd way). the accordions (especially the main menu on the left) are little more complex, but they were built according to the spry widget document, found on the adobe spry website.
    so, here it is -- check the accordion on the left side (the bug seems to happen almost always while opening/closing the last BLUE "section" of the accordion, please play with the accordion for a while to reproduce it -- while the accordion closes, it "loses" it's bottom margin (i guess), what's even more wierd, everything gets back to place after you move a mouse):
    http://www.prazskematky.cz/home.php
    PLEASE NOTICE: since the website is still under development and i'm using a IE meta tag to force it into IE7 rendering, to reproduce this behavior please be shure to switch IE engine to IE8 standards mode
    well, we all now how IE handles css... so it's propably an IE bug -- anyway if you have encountered a similar issue of even better found a fix, please let know. (i don't consider a fix switching to another js library, i would like to use the spry, because of it's DW integration)
    many thanks,
    p.s.

    ross m. greenberg wrote:
    > Now however the entire .gif is not appearing in the
    accordion panel is expanded. I insert the graphic using a standard
    "menu insert/graphic/browse and select"
    >
    > the graphic file is not showing up properly on such an
    insert...
    Are you referring to what it looks like in Design view? If
    so, that's
    correct. Accordion panels have a fixed height. From memory, I
    think it's
    200px. However, if you test the page in a browser, you should
    see a
    scrollbar automatically generated on panels that have content
    that
    exceeds the height of the panel.
    If you want flexible-height panels in the accordion, you need
    to adjust
    both the CSS and the script that initializes the accordion. I
    have
    covered all the details in my "Essential Guide to Dreamweaver
    CS3" (and
    the forthcoming CS4 edition). You can probably find online
    tutorials as
    well. Try a Google search for Spry flexible height accordion.
    The accordion widget has been around since CS3, and it hasn't
    changed in
    CS4, so a Google search should bring up a lot of information.
    David Powers, Adobe Community Expert
    Author, "The Essential Guide to Dreamweaver CS3" (friends of
    ED)
    Author, "PHP Solutions" (friends of ED)
    http://foundationphp.com/

Maybe you are looking for