HTML- ды ұзақ уақыт бойы жазғандарыңыз элемент туралы есте сақтауы мүмкін. Бұл браузерге тән элемент, экранда жылжыту мәтінінің баннерін жасады. Бұл элемент ешқашан HTML спецификациясына қосылмады және оны қолдау браузерлер арасында кеңінен өзгерді. Адамдар бұл элементті пайдалану туралы жиі қатты пікірге ие болды - оң және теріс. Бірақ сен оны жақсы көресің бе, әлде жек көресің бе, ол шекарадағы шекаралар толып кеткен мазмұнды жасау мақсатына қызмет етті.
Қарапайым көзқараспен қатар, браузерлер ешқашан толықтай іске асырылмағандықтан, оның визуалды әсері деп есептеледі, сондықтан оны құрылымды анықтайтын HTML анықтамауы керек. Оның орнына, көрнекі немесе көрнекі әсерлер CSS арқылы басқарылуы керек. Және CSS3 браузерлері маркивтің әсерін элементтерге қалай қосатынын бақылау үшін маркси модулін қосады.
Жаңа CSS3 сипаттары
CSS3 бағдарламасы мазмұнды маркемеде қалай көрінетінін бақылауға көмектесетін бес жаңа қасиетті қосады: толтыру стилі, маркиз стилі, маркси-ойын-сана, маркис-бағдар және маркси жылдамдығы.
толқын стилі
Overflow стилі сипаты (CSS Overflow мақаласында да талқыланған) мазмұн ұяшығынан асып түсетін мазмұн үшін таңдаулы мәнерді анықтайды. Егер мәнді маркизге немесе маркис-блокқа орнатсаңыз, онда мазмұныңыз солға / оңға (маркис-сызыққа) немесе жоғары / төменге (маркис-блокқа) жылжиды.
маркиз стилі
Бұл сипат мазмұнның қарауға (және сыртына) қалай жылжитынын анықтайды.
Опциялар жылжыту, сырғыту және баламалы болып табылады. Айналдыру мазмұнды толығымен өшірілген экраннан бастайды, содан кейін ол бүкіл экраннан қайтадан өшірілгенше көрінетін аймаққа жылжиды. Слайд мазмұны толығымен өшірілген экраннан басталады, содан кейін мазмұн толығымен экранды жылжытқанша жылжиды және экранда сырғыту үшін қалған мазмұн жоқ.
Ақыр соңында, кезектесіп, мазмұнды бір жағынан екінші жағына қарай сырғытып жібереді.
marquee-play-count
MARQUEE элементін пайдаланудың кемшіліктерінің бірі маркси ешқашан тоқтамайды. Бірақ, стиль сипатымен marquee-play-счётына сәйкес, сіз маркекті белгілі бір уақыт ішінде мазмұнды қосып-өшіру үшін белгілей аласыз.
бағыт-бағдар
Сондай-ақ, мазмұнды экранда жылжытатын бағытты таңдауға болады. Алға және кері мәндер толып тастау стилі marquee-line және жоғары немесе төмен болған кезде мәтіннің бағытына негізделеді.
Marquee-Direction Details
| толқын стилі | Тілдік бағыт | алға | кері |
|---|---|---|---|
| маркси-сызық | лт | сол | құқық |
| rtl | құқық | сол | |
| маркиз-блок | жоғары | төмен |
жылдамдық жылдамдығы
Бұл сипат мазмұнды экранда қаншалықты тез жылжытатындығын анықтайды. Мәндер баяу, қалыпты және жылдам. Нақты жылдамдық мазмұны мен браузерді көрсететіндігіне байланысты, бірақ мәндер баяу болуы керек, бұл жылдамырақ қарағанда баяу қалыптыдан баяу.
Marquee сипаттарын шолғышты қолдау
CSS маркис элементтерін жұмыс істеу үшін жеткізушілердің префикстерін пайдалану қажет болуы мүмкін. Олар келесідей:
| CSS3 | Сатушы префиксі |
|---|---|
| overflow-x: marquee-line; | overflow-x: -webkit-marquee; |
| маркиз стилі | -webkit-marquee-стилі |
| marquee-play-count | -webkit-marquee-қайталау |
| бағыт-бағдар: алға | кері; | -жұмыс-маркиз-бағыт: форвардтар | артқа; |
| жылдамдық жылдамдығы | -webkit-marquee-speed |
| балама жоқ | -webkit-marquee-increment |
Соңғы қасиеті, қадамдардың шетінен үлкен немесе кішкентай болуы тиіс, себебі мазмұн шегінен экранда жылжытады.
Сіздің маркизіңіздің жұмыс істеуін қамтамасыз ету үшін алдымен сатушының префиксивті мәндерін орналастыру керек, содан кейін оларды CSS3 ерекшелігі мәндерімен орындаңыз. Мысалға, мәтінді сол жақтан оң жаққа 200x50 ұяшықта бес рет аударатын маркизге CSS.
{
ені: 200px; биіктігі: 50px; ақ-кеңістік: nowrap;
толтыру: жасырын;
overflow-x: -webkit-marquee;
-webkit-marquee-direction: форвардтар;
-webkit-marquee-style: айналдыру;
-webkit-marquee-speed: қалыпты;
-webkit-marquee-increment: шағын;
-webkit-marquee-қайталау: 5;
overflow-x: marquee-line;
бағыт-бағдар: алға;
marquee-style: айналдыру;
marquee-speed: қалыпты;
marquee-play-count: 5;
}