View Full Version : Buttons on an overlay

18 Jul 2010, 1:45 AM
I have a long project I would like to complete and release for public use and abuse. I am trying to break my questions here down into easy to answer, since my longer questions have been buried in the forum.

Today's question is: Can you include a button in a card on a carousel that moves with the carousel? One for each card in the carouself? How can you do that?

I have tried to use the button example on the kitchen sink (a series of buttons sliding in on a card sounds similar) but when I do the button covers the entire area of the carousel card with massive text, and I cannot set up a button on more than one card. (generates an error) I can't seem to find where the css information for each button comes from the example. :(

(removed example since it is no longer online)

My intention is to have each card contain an article for a digital magazine, but when you get to that card, all you see is the title and the author/photographer for the article. Clicking on the text in the button will eventually open an overlay with the information pertaining to what you clicked displayed inside (hopefully the overlay is animated as sliding down from the button or up so you can see the image in the background.) Setting up the overlay is tomorrows question.

If someone can point me to a more appropriate example that indicates changing fonts and colors of buttons, or offer a better suggestion, that would great.

19 Jul 2010, 3:14 AM
Hi nosarious,

I have almost the same concern here, everybody out there, please is there any possibility to have some kind of transparent buttons or hotspots over an image in the carousel ?
I have this example here : http://extranet.dpdh.net/iphone/ex2/ and I want to be able to add buttons over the different rings and jewelleries to have them bigger ina popup.

Thank you for ur help

19 Jul 2010, 8:09 AM
Nice photographs. This isn't really a hint for what you want, but more of a suggestion for the user interface.

You have a lot of objects which bleed together and are not easy to identify in a grid grouping. I would suggest what someone else was playing with: Double click on the card and have it flip over, revealing a list of items that lists the various jewellery pieces and the description and prices.

Just a suggestion.

To find more info about that, I would visit this thread: http://www.sencha.com/forum/showthread.php?103825-Changing-viewport-scale-at-runtime&p=486779#post486779

Pablo Cabana has also linked a simplified version of what he is doing in the thread, so you can see how the flip routine works. It will still require a bit of work, though.

20 Jul 2010, 8:40 AM
Thank you nosarious for the response, unfortunately, the client desires the carousel to behave this way, tap on one of the jewelleries to display a bigger image.

Anyway, I will look after that but can you please give me some help on another matter.
when we open the website on iphone/ipod touch on portrait mode, everything is fine but I would like to be able to rotate the iphone/ipod touch and load a new carousel or the same BUT with the images adapted to the screen resolution in fullscreen.

Is this possible ? and please how to do it ?