Числата като плъзгачи
Броячите, обсъдени в предишния раздел, не са единственият начин за представяне на входни числа. Вероятно сте запознати и с компонентите на плъзгача, един от които е показан на фигура 1. 9.8.
Плъзгачите вече са налични в Custom
слайдерът изглежда фантастично като спинер:
Ориз. 9.8. Плъзгач
Налични са същите атрибути като за полето за въвеждане type="number" : min , max , step , value . Те означават същото. Само външният вид на потребителския интерфейс е различен. Вместо нормално поле за въвеждане, от браузърите се очаква да показват type="range" като плъзгач. Докато се пише тази глава, най-новите версии на Safari, Chrome и Opera вече правят това. За съжаление, iPhone показва само текстово поле и дори не оптимизира екранната клавиатура за въвеждане на числа. Всички други браузъри третират полета от този тип като type="text" . Като цяло няма сериозни причини, които да ви попречат да започнете да използвате плъзгачите
Избирачи на дати
HTML4 нямаше компонент за избор на дата. Решението беше намерено в различни
други (Dojo, jQuery UI, YUI и библиотеката Closure), но
Разбира се, всяко подобно решение изисква постоянно разчитане на рамката, с която е изграден селекторът.
HTML5 в крайна сметка дефинира вградена контрола за избор на дата, която не разчита на потребителски скриптове. Всъщност има шест различни инструмента за избор: дата, месец, седмица, час, дата+час и дата+час с часова зона.
От табл. 9.4 показва, че в момента поддръжката на тази функционалност, меко казано, не е широка.
Таблица 9.4. Поддръжка за избор на дати
Как Opera изобразява е показано на фиг. 9.9.
Ориз. 9.9.Избор на дата
Ориз. 9.10. Избор на дата
Ориз. 9.11. Избор на месец
В случай, че се изисква дата заедно с часа, Opera поддържа селектор, чийто външен вид е показан на фиг. 9.10.
Ако са необходими само месец и година (може би отнасящи се до месеца, в който кредитната карта изтича, например), Opera ще покаже обекта, показан на фиг. 9.11.
По-рядко, но е налична и селекция от конкретна седмица от годината. Това ви позволява да направите обект (фиг. 9.12).
Глава 9.. като форма на лудост
Най-накрая можете да изберете само време с помощта на
schyu обект (фиг. 9.13).
zerah, не разпознава type="date" и неговите варианти, тези
полета, като полета type="email" (вижте раздела "Имейл адреси").
показани като полета за въвеждане на обикновен текст. Ако
тип="дата"> и "близките" му вече могат
вграждане: това ще зарадва потребителите на Opera и други
Ориз. 9.12. Избор на седмица
Дата kov (вижте раздела Типове полета за въвеждане в Глава 2),
и как да използвате един от сценариите като резервно решение
Нариев по ваш избор:
Формуляри за търсене
Ето една наистина интересна тема. Същността на всичко е доста проста, трябва да се обяснят само някои подробности за изпълнението. И така... търсете.
В наши дни това далеч не е просто търсене от Google или Yahoo! (въпреки че и това). Помислете за всяка форма за търсене на всяка страница или сайт. Полетата за търсене имат Amazon, Newegg, повечето блогове и т.н. Как се правят тези форми? Те се основават, както повечето полета за въвеждане на текст в мрежата днес, на базата на етикета. HTML5 коригира проблема:
В някои браузъри такова поле ще бъде неразличимо от обикновено текстово поле. Но когато използвате Safari на Mac OS X, формулярът за търсене ще изглежда така: 9.14.
И още нещо
Долавяте ли разликата? Полето за въвеждане е със заоблени ъгли! Да, разбира се, в момента ви е трудно да сдържате емоциите си, но почакайте: това не е всичко! Когато започнете да въвеждате в полето type="search", Safari ще покаже бутон с кръст отдясно на полето. Натискането му ще изчисти полето от текст (Google Chrome, който е подобен по своята технология на Safari, се държи по същия начин). И двата трика са моделирани след родни форми за търсене в iTunes и други клиентски приложения на Mac OS X (Фигура 9-15).
Ориз. 9.14. Форма за търсене
Ориз. 9.15. Форма за търсене с фокус
Apple използва маркера за формуляр за търсене на своя сайт, за да му придаде атмосфера на Macintosh. Но в тази функционалност няма нищо специфично за Macintosh. По принцип това е просто маркиране на хипертекст. Всеки браузър на всяка платформа може да изобрази формата за търсене в съответствие с общия стил на платформата.
Браузърите, които не приемат type="search", ще го видят, както и другите нови типове, като нищо повече от обикновен type="text" . Струва си да помислите за използването на полета type="search" във всички полета за търсене точно сега.
Color Pickers
Спецификацията на HTML5 също описва поле за въвеждане, което ви позволява да изберете цвят и връща неговия шестнадесетичен код. Браузърите все още не поддържат избор на цвят - и това, честно казано, е много лошо. Винаги съм харесвал панелите за избор на цвят на Mac OS. Може би това ще бъде внедрено в браузърите.
Има обаче една причина, която усложнява приложението
Назовавам най-основните неща: граници, фон
. Отидете до полетата за търсене на Safari
цветове, фонови изображения, подложки и др.). Но те са
не се прилага стандарт (стандарт
И още нещо