ਮਾਰਕਿੀਅ ਦੇ ਬਿਨਾਂ HTML5 ਅਤੇ CSS3 ਵਿਚ ਸਕ੍ਰੋਲਯੋਗ ਸਮੱਗਰੀ ਨੂੰ ਬਣਾਉਣਾ

ਤੁਹਾਡੇ ਵਿੱਚੋਂ ਜਿਹੜੇ ਲੰਮੇ ਸਮੇਂ ਲਈ ਐਚਟੀਐਮਐਲ ਲਿਖ ਰਹੇ ਹਨ ਉਹ ਤੱਤ ਯਾਦ ਰੱਖ ਸਕਦੇ ਹਨ. ਇਹ ਇੱਕ ਬ੍ਰਾਊਜ਼ਰ-ਵਿਸ਼ੇਸ਼ ਤੱਤ ਸੀ ਜਿਸ ਨੇ ਸਕ੍ਰੀਨਿੰਗ ਟੈਕਸਟ ਦੇ ਇੱਕ ਬੈਨਰ ਨੂੰ ਸਕ੍ਰੀਨ ਤੇ ਬਣਾਇਆ. ਇਹ ਐਲੀਮੈਂਟ ਨੂੰ HTML ਸਪੈਸੀਕਸ਼ਨ ਵਿੱਚ ਜੋੜਿਆ ਨਹੀਂ ਗਿਆ ਸੀ ਅਤੇ ਇਸਦਾ ਸਮਰਥਨ ਬ੍ਰਾਉਜ਼ਰ ਭਰ ਵਿੱਚ ਵਿਆਪਕ ਰੂਪ ਤੋਂ ਵੱਖਰਾ ਸੀ. ਲੋਕ ਅਕਸਰ ਇਸ ਤੱਤ ਦੇ ਇਸਤੇਮਾਲ ਬਾਰੇ ਬਹੁਤ ਹੀ ਮਜ਼ਬੂਤ ​​ਵਿਚਾਰ ਰੱਖਦੇ ਸਨ - ਦੋਵੇਂ ਸਕਾਰਾਤਮਕ ਅਤੇ ਨਕਾਰਾਤਮਕ. ਪਰੰਤੂ ਕੀ ਤੁਸੀਂ ਇਸ ਨੂੰ ਪਿਆਰ ਕੀਤਾ ਜਾਂ ਨਫ਼ਰਤ ਕੀਤੀ, ਇਹ ਉਸ ਸਮੱਗਰੀ ਨੂੰ ਬਣਾਉਣ ਦੇ ਉਦੇਸ਼ ਦੀ ਪੂਰਤੀ ਕਰਦਾ ਸੀ ਜਿਸ ਨੂੰ ਬਾਕਸ ਦੀ ਸੀਮਾਵਾਂ ਨੂੰ ਦਿਖਾਈ ਦਿੱਤਾ.

ਇਸ ਦਾ ਇਕ ਭਾਗ ਜਿਸਨੂੰ ਬ੍ਰਾਉਜ਼ਰ ਦੁਆਰਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਲਾਗੂ ਨਹੀਂ ਕੀਤਾ ਗਿਆ ਸੀ, ਜੋ ਨਿੱਜੀ ਵਿਅਕਤੀਗਤ ਮੱਤ ਤੋਂ ਇਲਾਵਾ ਹੈ, ਇਹ ਸੀ ਕਿ ਇਹ ਇੱਕ ਵਿਜ਼ੂਅਲ ਪਰਭਾਵ ਸਮਝਿਆ ਜਾਂਦਾ ਹੈ ਅਤੇ ਇਸ ਤਰ੍ਹਾਂ, ਇਸਨੂੰ HTML ਦੁਆਰਾ ਨਹੀਂ ਪਰਿਭਾਸ਼ਤ ਕੀਤਾ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ, ਜੋ ਕਿ ਬਣਤਰ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦਾ ਹੈ. ਇਸਦੀ ਬਜਾਏ, ਵਿਜ਼ੂਅਲ ਜਾਂ ਪ੍ਰਸਾਰਣ ਪ੍ਰਭਾਵਾਂ ਨੂੰ CSS ਦੁਆਰਾ ਪ੍ਰਬੰਧਿਤ ਕੀਤਾ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ ਅਤੇ CSS3 ਐਲੀਮੈਂਟ ਨੂੰ ਮਾਰਕ ਪ੍ਰਭਾਵ ਨੂੰ ਕਿਵੇਂ ਜੋੜਦਾ ਹੈ ਇਹ ਨਿਯੰਤਰਣ ਕਰਨ ਲਈ ਮਾਰਕੀ ਮੋਡੀਊਲ ਜੋੜਦਾ ਹੈ.

ਨਵਾਂ CSS3 ਵਿਸ਼ੇਸ਼ਤਾ

CSS3 ਤੁਹਾਡੀ ਨਵੀਂ ਸਮੱਗਰੀ ਨੂੰ ਕਿਵੇਂ ਕੰਟਰੋਲ ਕਰਦਾ ਹੈ ਕੰਟਰੋਲ ਕਰਨ ਵਿੱਚ ਮਦਦ ਕਰਦਾ ਹੈ: ਓਵਰਫਲੋ-ਸਟਾਈਲ, ਮਾਰਕੀ-ਸਟਾਈਲ, ਮਾਰਕੀ-ਪਲੇ-ਕਾਊਂਟ, ਮਾਰਕੀ-ਦਿਸ਼ਾ ਅਤੇ ਮਾਰਕੀ-ਸਪੀਡ.

ਓਵਰਫਲੋ-ਸਟਾਈਲ
ਓਵਰਫਲੋ-ਸਟਾਈਲ ਪ੍ਰਾਪਰਟੀ (ਜਿਸ ਵਿੱਚ ਮੈਂ ਲੇਖ CSS ਓਵਰਫਲੋ ਵਿੱਚ ਵੀ ਚਰਚਾ ਕੀਤੀ ਹੈ) ਸਮਗਰੀ ਬੌਕਸ ਤੇ ਓਵਰਫਲੋ ਕਰਦਾ ਸਮਗਰੀ ਲਈ ਤਰਜੀਹੀ ਸਟਾਈਲ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦਾ ਹੈ. ਜੇਕਰ ਤੁਸੀਂ ਵੈਲਕਮ-ਲਾਈਨ ਜਾਂ ਵਹਾ-ਬਲਾਕ-ਬਲਾਕ ਕਰਨ ਲਈ ਵੈਲਯੂ ਸੈਟ ਕਰਦੇ ਹੋ ਤਾਂ ਤੁਹਾਡੀ ਸਮਗਰੀ ਖੱਬੇ / ਸੱਜੇ (ਮਾਰਕੀ-ਲਾਈਨ) ਜਾਂ ਉੱਪਰ / ਹੇਠਾਂ (ਮਾਰਕੀ-ਬਲਾਕ) ਵਿੱਚ ਅਤੇ ਬਾਹਰ ਚਲੇਗੀ.

ਮਾਰਕੀ-ਸ਼ੈਲੀ
ਇਹ ਜਾਇਦਾਦ ਇਹ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦੀ ਹੈ ਕਿ ਸਮੱਗਰੀ ਕਿਵੇਂ ਵੇਖਾਈ ਜਾਵੇਗੀ (ਅਤੇ ਬਾਹਰ).

ਚੋਣਾਂ ਸਕ੍ਰੌਲ, ਸਲਾਈਡ ਅਤੇ ਵਿਕਲਪਿਕ ਹਨ. ਸਕੋਲਨ ਸੰਪੂਰਨ ਰੂਪ ਤੋਂ ਬੰਦ ਪਰਦਾ ਨਾਲ ਸ਼ੁਰੂ ਹੁੰਦੀ ਹੈ, ਅਤੇ ਫੇਰ ਇਸਨੂੰ ਦੇਖਣ ਵਾਲੇ ਖੇਤਰ ਤੇ ਫੈਲ ਜਾਂਦਾ ਹੈ ਜਦੋਂ ਤੱਕ ਇਹ ਪੂਰੀ ਤਰ੍ਹਾਂ ਬੰਦ ਹੋ ਜਾਂਦਾ ਹੈ. ਸਲਾਇਡ ਪੂਰੀ ਤਰ੍ਹਾਂ ਨਾਲ ਸਕਰੀਨ ਦੇ ਨਾਲ ਸ਼ੁਰੂ ਹੁੰਦੀ ਹੈ ਅਤੇ ਫਿਰ ਇਹ ਉਦੋਂ ਤੱਕ ਚੱਲਦੀ ਹੈ ਜਦੋਂ ਤੱਕ ਸਮੱਗਰੀ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਕ੍ਰੀਨ ਤੇ ਨਹੀਂ ਵਧਾਈ ਜਾਂਦੀ ਅਤੇ ਸਕ੍ਰੀਨ ਤੇ ਸਲਾਈਡ ਕਰਨ ਲਈ ਕੋਈ ਹੋਰ ਸਮੱਗਰੀ ਨਹੀਂ ਬਚੀ ਹੈ.

ਅਖੀਰ ਵਿੱਚ, ਵਿਕਲਪਕ ਸਮੱਗਰੀ ਨੂੰ ਇੱਕ ਪਾਸੇ ਤੋਂ ਦੂਜੇ ਪਾਸੇ ਉਛਾਲਦੀ ਹੈ, ਪਿੱਛੇ ਅਤੇ ਅੱਗੇ ਸਲਾਈਡ ਕਰਦੇ ਹੋਏ

marquee-play-count
ਮਾਰਕਈ ਤੱਤ ਦਾ ਇਸਤੇਮਾਲ ਕਰਨ ਦੀ ਇੱਕ ਕਮਾਈ ਇਹ ਹੈ ਕਿ ਮਾਰਕੀ ਕਦੇ ਨਹੀਂ ਰੁਕਦੀ. ਪਰ ਸ਼ੈਲੀ ਦੀ ਪ੍ਰਾਪਰਟੀ ਮਾਰਕੀ-ਪਲੇ-ਕਾਊਂਟ ਨਾਲ ਤੁਸੀਂ ਕਿਸੇ ਖਾਸ ਨੰਬਰ ਲਈ ਸਮਗਰੀ ਨੂੰ ਘੁੰਮਾਉਣ ਲਈ ਅਤੇ ਮਾਰਕੀਟ ਨੂੰ ਸੈਟ ਕਰ ਸਕਦੇ ਹੋ.

ਮਾਰਕੀ-ਦਿਸ਼ਾ
ਤੁਸੀਂ ਨਿਰਦੇਸ਼ ਦੀ ਵੀ ਚੋਣ ਕਰ ਸਕਦੇ ਹੋ ਕਿ ਸਮੱਗਰੀ ਨੂੰ ਸਕ੍ਰੀਨ ਉੱਤੇ ਸਕ੍ਰੌਲ ਕਰਨਾ ਚਾਹੀਦਾ ਹੈ. ਅੱਗੇ ਅਤੇ ਰਿਵਰਸ ਮੁੱਲ ਪਾਠ ਦੀ ਦਿਸ਼ਾ ਤੇ ਆਧਾਰਿਤ ਹੁੰਦੇ ਹਨ ਜਦੋਂ ਓਵਰਫਲੋ-ਸਟਾਈਲ ਮਾਰਚਲੀ-ਲਾਈਨ ਅਤੇ ਉੱਪਰ ਜਾਂ ਹੇਠਾਂ ਹੁੰਦਾ ਹੈ ਜਦੋਂ ਓਵਰਫਲੋ-ਸਟਾਈਲ ਮਲਕੀ-ਬਲਾਕ ਹੁੰਦਾ ਹੈ.

ਮਾਰਕੀ-ਦਿਸ਼ਾ ਨਿਰਦੇਸ਼

ਓਵਰਫਲੋ-ਸਟਾਈਲ ਭਾਸ਼ਾ ਦੀ ਦਿਸ਼ਾ ਅੱਗੇ ਉਲਟਾ
ਮਾਰਕੀ-ਲਾਈਨ ltr ਖੱਬੇ ਸੱਜੇ
rtl ਸੱਜੇ ਖੱਬੇ
ਮਾਰਕੀ-ਬਲਾਕ ਅਪ ਥੱਲੇ, ਹੇਠਾਂ, ਨੀਂਵਾ

ਮਾਰਕੀਟ-ਸਪੀਡ
ਇਹ ਵਿਸ਼ੇਸ਼ਤਾ ਨਿਸ਼ਚਿਤ ਕਰਦੀ ਹੈ ਕਿ ਸਕ੍ਰੀਨ ਤੇ ਸਮਗਰੀ ਸਕੁਲ ਕਿੰਨੀ ਤੇਜ਼ੀ ਨਾਲ ਸਕ੍ਰੀਨ ਤੇ ਹੈ. ਮੁੱਲ ਹੌਲੀ, ਆਮ ਅਤੇ ਤੇਜ਼ ਹਨ. ਅਸਲ ਸਪੀਡ ਸਮੱਗਰੀ ਅਤੇ ਇਸ ਨੂੰ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਨ ਵਾਲੇ ਬਰਾਊਜ਼ਰ ਉੱਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ, ਪਰ ਮੁੱਲ ਹੌਲੀ ਹੋਣਾ ਚਾਹੀਦਾ ਹੈ ਜੋ ਹੌਲੀ ਹੋਣਾ ਆਮ ਨਾਲੋਂ ਹੌਲੀ ਹੁੰਦਾ ਹੈ ਜੋ ਤੇਜ਼ ਨਾਲੋਂ ਹੌਲੀ ਹੁੰਦਾ ਹੈ.

ਮਾਰਕਿਟ ਵਿਸ਼ੇਸ਼ਤਾ ਦਾ ਬ੍ਰਾਊਜ਼ਰ ਸਪੋਰਟ

CSS ਮਾਰਕੀ ਤੱਤ ਕੰਮ ਕਰਨ ਲਈ ਤੁਹਾਨੂੰ ਵਿਕਰੇਤਾ ਅਗੇਤਰਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੀ ਲੋੜ ਹੋ ਸਕਦੀ ਹੈ. ਉਹ ਇਹ ਹਨ:

CSS3 ਵਿਕਰੇਤਾ ਅਗੇਤਰ
ਓਵਰਫਲੋ-ਐਕਸ: ਮਾਰਕੀ-ਲਾਈਨ; ਓਵਰਫਲੋ-ਐਕਸ: -ਵਬਕੀਟ-ਮਾਰਕੀ;
ਮਾਰਕੀ-ਸ਼ੈਲੀ -webkit-marquee-style
marquee-play-count -webkit-marquee-repetition
ਮਾਰਕੀ-ਦਿਸ਼ਾ: ਅੱਗੇ | ਰਿਵਰਸ; -ਵਬਕੀਟ-ਮਾਰਕੀ-ਦਿਸ਼ਾ: ਅੱਗੇ- ਪਿੱਛੇ ਵੱਲ;
ਮਾਰਕੀਟ-ਸਪੀਡ -webkit-marquee-speed
ਕੋਈ ਬਰਾਬਰ ਨਹੀਂ -webkit-marquee- ਵਾਧਾ

ਆਖਰੀ ਸੰਪੱਤੀ ਤੁਹਾਨੂੰ ਇਹ ਦੱਸਣ ਦੇ ਯੋਗ ਬਣਾਉਂਦੀ ਹੈ ਕਿ ਮਾਰਕਿਟ ਵਿੱਚ ਸਕ੍ਰੀਨ ਤੇ ਸਮਗਰੀ ਸਕ੍ਰੋਲਾਂ ਦੇ ਰੂਪ ਵਿੱਚ ਕਿੰਨੇ ਵੱਡੇ ਜਾਂ ਛੋਟੇ ਕਦਮ ਹੋਣੇ ਚਾਹੀਦੇ ਹਨ.

ਆਪਣੇ ਮਾਰਕਿਟ ਦੇ ਕੰਮ ਕਰਨ ਲਈ, ਤੁਹਾਨੂੰ ਪਹਿਲਾਂ ਵਿਕਰੇਤਾ ਪ੍ਰੀਫਿਕਸ ਮੁੱਲਾਂ ਨੂੰ ਰੱਖਣਾ ਚਾਹੀਦਾ ਹੈ ਅਤੇ ਫਿਰ ਇਹਨਾਂ ਨੂੰ CSS3 ਦੇ ਨਿਰਧਾਰਨ ਮੁੱਲਾਂ ਦੇ ਨਾਲ ਪਾਲਣਾ ਕਰਨੀ ਚਾਹੀਦੀ ਹੈ. ਉਦਾਹਰਨ ਲਈ, ਇੱਥੇ ਇੱਕ ਮਾਰਕ ਲਈ CSS ਹੈ ਜੋ ਖੱਬੇ ਪਾਸੇ ਸੱਜੇ ਪਾਸੇ 200x50 ਬਾਕਸ ਦੇ ਅੰਦਰ ਪੰਜ ਵਾਰ ਟੈਕਸਟ ਨੂੰ ਸਕ੍ਰੌਲ ਕਰਦਾ ਹੈ.

{
ਚੌੜਾਈ: 200 ਪੈਕਸ; ਉਚਾਈ: 50px; ਸਫੈਦ-ਸਪੇਸ: ਹੁਣ ਵਾਲੇ;
ਓਵਰਫਲੋ: ਲੁਕਿਆ;
ਓਵਰਫਲੋ-ਐਕਸ: -ਵਬਕੀਟ-ਮਾਰਕੀ;
-webkit-marquee-direction: ਅੱਗੇ;
-webkit-marquee-style: ਸਕਰੋਲ ਕਰੋ;
-webkit-marquee-speed: ਆਮ;
-webkit-marquee- ਵਾਧਾ: ਛੋਟਾ;
-webkit-marquee-repetition: 5;
ਓਵਰਫਲੋ-ਐਕਸ: ਮਾਰਕੀ-ਲਾਈਨ;
ਮਾਰਕੀ-ਦਿਸ਼ਾ: ਅੱਗੇ;
marquee-style: ਸਕਰੋਲ;
ਮਾਰਕੀ-ਗਤੀ: ਆਮ;
ਮਾਰਕੀ-ਪਲੇ-ਗਿਣਤੀ: 5;
}