Kupanga Zinthu Zowonongeka mu HTML5 ndi CSS3 Popanda MARQUEE

Awo omwe akhala akulemba HTML kwa nthawi yayitali akhoza kukumbukira chofunika. Ichi chinali chinthu chowonekera pamsakatuli chomwe chinapanga banner ya scrolling text kudutsa pazenera. Chigawo ichi sichinayambe kuwonjezeredwa ku ndondomeko ya HTML ndi chithandizo kwa izo zosiyana kwambiri kudutsa ma browsers. Anthu nthawi zambiri anali ndi malingaliro amphamvu okhudza kugwiritsa ntchito izi - zonse zabwino ndi zoipa. Koma kaya mumakonda kapena mukudana nazo, izo zimagwira cholinga chopanga zokwanira zomwe zikufalikira malire a bokosi owoneka.

Chimodzi mwazifukwa zomwe sizinagwiritsidwe ntchito mwachindunji ndi osakayikira, kupatula pa lingaliro lolimba laumwini, linali kuti likuwoneka ngati lowonetsa ndipo kotero, siliyenera kufotokozedwa ndi HTML, lomwe limatanthauzira kapangidwe kawo. M'malo mwake, zotsatira zowonekera kapena zowonetsera ziyenera kuyendetsedwa ndi CSS. Ndipo CSS3 imapanga gawo la marquee kuti liwone momwe asakatuli amathandizira ma marquee kusintha kwa zinthu.

Zida Zatsopano za CSS3

CSS3 imapanga zinthu zisanu zatsopano kuti zithandizire kuwona momwe maonekedwe anu amasonyezera pa marquee: mawonekedwe obirira, mawonekedwe a marquee, masewera, masewera, ndi maulendo-speed.

ndondomeko ya kusefukira
Chida chokwanira (chimene ine ndinakambilaninso m'nkhani CSS Kusefukira) chimatanthauzira kalembedwe ka zinthu zomwe zimakhudza bokosilo. Ngati mutayika mtengo ku mateka kapena malonda-tsala zanu zidzalowa mkati ndi kumanja kumanzere / kumanja (marquee-line) kapena mmwamba / pansi (marquee-block).

zojambulajambula
Malo awa amamasulira momwe zomwe zidzasunthira powonekera (ndi kunja).

Zosankhazo ndi mpukutu, slide ndi zina. Mipukutu imayambira ndi zomwe zamasewera, ndipo zimayenda kudutsa malo owonetsera mpaka zonse zitachoka pakompyuta. Chotsitsa chimayambira ndi zomwe zamasulidwa pang'onopang'ono kenako zimadutsamo mpaka zomwe zakhala zikugwedezeka pazenera ndipo palibe zomwe zatsala kuti zisinthe pazenera.

Potsirizira pake, njira zina zimagwedeza zomwe zili kumbali, kumbuyo ndi kutsogolo.

masewera osewera
Imodzi mwa zovuta zogwiritsira ntchito chinthu cha MARQUEE ndi chakuti marquee samaima. Koma ndi kalembedwe kachipangizo kamene mungapangire marquee kuti iwononge zomwe mwalembazo ndi kuzichotsera nthawi zingapo.

malonda-malangizo
Mukhozanso kusankha njira zomwe zilipo ziyenera kuwombera pazenera. Zomwe zimayendera ndi kutsogolo zimachokera kuzitsogozo za mawu pamene falilo lakutukuka ndi mzere wamakina ndi mmwamba kapena pansi pamene mawonekedwe okhutira ndi mawonekedwe.

Zambiri za Malangizo

ndondomeko ya kusefukira Utsogoleri wa Zinenero patsogolo kubwerera
mzere wamakina ltr kumanzere kulondola
rtl kulondola kumanzere
marquee-block mmwamba pansi

makina othamanga
Malo awa amatsimikizira momwe malembawo akufulumira pawindo. Miyezo ndi yochedwa, yachibadwa, ndi yachangu. Ulendo weniweni umadalira zomwe zilipo komanso osatsegula akuwonetsera, koma zoyenera ziyenera kukhala pang'onopang'ono ndi zocheperapo kusiyana ndi zachizolowezi zomwe zimachedwa mofulumira.

Zothandizira Otsata Ma Properties Marquee

Mungafunikire kugwiritsa ntchito zida zogulitsa kuti mugwirizane ndi zinthu za CSS. Zili motere:

CSS3 Choyamba Chogulitsa
kusefukira-x: marquee-line; kusefukira-x: -webkit-marquee;
zojambulajambula mtambo -webkit-marquee
masewera osewera -bwebkit-marquee-kubwereza
malonda-kutsogolo: patsogolo | kutsogolo; -bwatch-marquee-malangizo: kutsogolo | kumbuyo;
makina othamanga -webkit-marquee-liwiro
palibe chofanana -bwin-marquee-increment

Malo otsiriza amakulolani kuti mudziwe momwe zingakhalire zazikulu kapena zing'onozing'ono zomwe zikuyenera kuwonekera pawindo pa marquee.

Kuti mukhale ndi marquee anu ogwira ntchito, muyenera kuyika malonda prefixed zoyamba ndikuwatsata ndi mfundo za CSS3. Mwachitsanzo, apa pali CSS ya marquee yomwe imapukuta maulendo asanu kuchokera kumanzere kupita kumanja mkati mwa bokosi la 200x50.

{
m'lifupi: 200px; kutalika: 50px; dera loyera: nowrap;
kusefukira: kubisika;
kusefukira-x: -webkit-marquee;
-webkit-marquee-malangizo: kutsogolo;
Mtundu wa style -webkit-marquee: pukuta;
-bwatch-marquee-speed: yachibadwa;
-bwin-marquee-increment: yaying'ono;
-bwebkit-marquee-kubwereza: 5;
kusefukira-x: marquee-line;
malonda: kutsogolo;
kalembedwe: pukuta;
makina othamanga: zachizolowezi;
masewera osewera: 5;
}}