PDA

View Full Version : Overflow in Carousel



stone_leopard
22 Sep 2010, 8:13 PM
I'm trying to create a horizontal carousel widget that flips through some pages. However, the text size is set to 32pt and the content doesn't fit in the window. I cannot figure out how to prevent the content from getting chopped off and enable the user to scroll vertically.

Here's the code i'm using:



cards = new Ext.Panel ({
title: 'Questions',
scroll: 'vertical',
fullscreen: true,
cls: 'quizpanel',
styleHtmlContent: true,
layout: {
type: 'fit',
align: 'stretch'
},
defaults: {
flex: 1
},
items: [ carousel ],
dockedItems: [ headerBar, footerBar ]
});


Thanks for any tips.

stone_leopard
22 Sep 2010, 8:17 PM
I have second unrelated regarding the font-family in use. The default is "Helvetica Neue" and I haven't been able to switch it to something else. Here's what I'm trying to do, but it doesn't seem to work.



div.card { font-family: 'Reenie Beanie' !important; font-size: 32px; }


Thanks again.

stone_leopard
23 Sep 2010, 5:06 AM
Is carousel not the right container for content that doesn't fit in a page? Should I be using a different scheme?

What I want to achieve is a set of pages that the user can flip through by swiping left/right, or clicking on dedicated next/prev buttons in the headerBar.

Thanks for any tips.
Pankaj

EthanEtienne
29 Sep 2010, 12:19 AM
I would love to know this also. I'm having the same problem.

steve1964
29 Sep 2010, 12:29 AM
Have you set the scroll in the carousel? The scroll: 'vertical' must be set in the carousel not in the panel...

EthanEtienne
29 Sep 2010, 12:43 AM
Now I just see a lot of white space at the bottom. Overflow is still hidden. I'm troubleshooting, will let you know if I find anything. Thanks!


Have you set the scroll in the carousel? The scroll: 'vertical' must be set in the carousel not in the panel...

steve1964
29 Sep 2010, 12:53 AM
Post the code, it's hard to say something in this way

EthanEtienne
29 Sep 2010, 12:59 AM
Man, I feel like such a dumb-ass right now. I had a panel inside a container inside the carousel. That really messed things up for me. I took out the container, set the panel to scroll vertical, and carousel to scroll false. Now it works! Thanks for the hint, it helped me find my way!

coolsegi
14 Mar 2011, 9:52 PM
you are right Eathen,I am able to see the overflow content with scrollbars. But my scroll bounce back to the original position it seems that scroll bars are not being updated? How to do that?