#javascript #sencha-touch #extjs #carousel #sencha-touch-2
#javascript #сенча-касание #extjs #карусель #sencha-touch-2
Вопрос:
Привет,
Мне не удалось попасть туда, куда я хочу, с помощью моей carousel. Это для веб-приложения для iPhone / iPad.
В принципе, я хочу показать часть моей предыдущей и следующей карточки элемента внутри карусели. Поскольку картинка стоит тысячи слов, вот окончательный вид, который я хочу получить :
То же, что и на скриншотах предварительного просмотра приложения в AppStore.
Я перепробовал много вещей, но пока ничего не работает.
Любые советы были бы замечательными 🙂 Спасибо!
Комментарии:
1. : Привет, ты нашел какое-нибудь решение, которое хорошо работает как на iphone, так и на Android? Спасибо!!
2. К сожалению, я закончил с простой каруселью. я очень разочарован sencha, и теперь я вернулся к native.
Ответ №1:
Это определенно было бы возможно, если бы вы «поместили» страницы карусели 3 на одну страницу с большим интервалом (полями или отступами) для создания эффекта.
На данном этапе нет общедоступных примеров каруселей с несколькими элементами (на одной странице), но это возможно, и в настоящее время я работаю над каруселью с несколькими элементами. Я добавил поля и отступы, чтобы получить 15 миниатюр на 1 странице.
🙂
Комментарии:
1. в то время я пытался использовать заполнение, но не смог заставить что-то работать
Ответ №2:
Доступен плагин coverflow, не совсем такой же, но похожий. Проверьте демонстрацию здесь:
http://twomonkeys.com.ar/lab/cover/
Вы можете получить исходный код здесь:
Комментарии:
1. спасибо, но это не тот эффект, который я хочу получить. Это кажется таким простым, но все еще не удалось найти решение.
Ответ №3:
вы можете использовать свойство set itemLength для Carousel,
Ext.create('Ext.Carousel', {
fullscreen: true,
itemLength: 250, // **you can change value as you want**
defaults: {
styleHtmlContent: true
},
items: [
{
html: 'item1',
style: 'background-color:red;'
}, {
html: 'item2',
style: 'background-color:white;'
}, {
html: 'item3',
style: 'background-color:gray;'
}, {
html: 'item4',
style: 'background-color:blue;'
}, {
html: 'item5',
style: 'background-color:yellow;'
}
]
});
Ответ №4:
Смотрите этот пост в блоге, где они объясняют это:
http://www.sencha.com/blog/using-the-leap-motion-controller-with-sencha-touch/
Они использовали это в своем коде:
itemLength: browserWidth * 0.8.