ದೀರ್ಘಕಾಲದವರೆಗೆ ಎಚ್ಟಿಎಮ್ಎಲ್ ಬರೆಯುವ ನಿಮ್ಮಲ್ಲಿರುವವರು ಅಂಶವನ್ನು ನೆನಪಿಸಿಕೊಳ್ಳಬಹುದು. ಇದು ಪರದೆಯ ಸುತ್ತ ಸ್ಕ್ರೋಲಿಂಗ್ ಪಠ್ಯದ ಬ್ಯಾನರ್ ಅನ್ನು ರಚಿಸಿದ ಬ್ರೌಸರ್ ನಿರ್ದಿಷ್ಟ ಅಂಶವಾಗಿದೆ. ಈ ಅಂಶವನ್ನು ಎಚ್ಟಿಎಮ್ಎಲ್ ವಿವರಣೆಯಲ್ಲಿ ಸೇರಿಸಲಾಗಿಲ್ಲ ಮತ್ತು ಅದರ ಬೆಂಬಲವು ಬ್ರೌಸರ್ಗಳಲ್ಲಿ ವ್ಯಾಪಕವಾಗಿ ಬದಲಾಗುತ್ತಿತ್ತು. ಧನಾತ್ಮಕ ಮತ್ತು ಋಣಾತ್ಮಕ ಎರಡೂ - ಈ ಅಂಶದ ಬಳಕೆಯ ಬಗ್ಗೆ ಜನರು ಹೆಚ್ಚಾಗಿ ಬಲವಾದ ಅಭಿಪ್ರಾಯಗಳನ್ನು ಹೊಂದಿದ್ದರು. ಆದರೆ ನೀವು ಅದನ್ನು ಪ್ರೀತಿಸಿದರೆ ಅಥವಾ ದ್ವೇಷಿಸುತ್ತಿದ್ದೀರಾ, ಅದು ಬಾಕ್ಸ್ ಗಡಿಗಳನ್ನು ಗೋಚರಿಸುವ ವಿಷಯವನ್ನು ತುಂಬಿಸುವ ಉದ್ದೇಶವನ್ನು ಪೂರೈಸಿದೆ.
ಇದು ಬ್ರೌಸರ್ಗಳಿಂದ ಸಂಪೂರ್ಣವಾಗಿ ಪೂರ್ಣಗೊಳಿಸದ ಕಾರಣ, ಬಲವಾದ ವೈಯಕ್ತಿಕ ಅಭಿಪ್ರಾಯದಿಂದ, ಇದು ಒಂದು ದೃಶ್ಯ ಪರಿಣಾಮವೆಂದು ಪರಿಗಣಿಸಲ್ಪಟ್ಟಿದೆ ಮತ್ತು ಅದು ರಚನೆಯ ವ್ಯಾಖ್ಯಾನವನ್ನು ಹೊಂದಿರುವ HTML ನಿಂದ ವ್ಯಾಖ್ಯಾನಿಸಬಾರದು. ಬದಲಿಗೆ, ದೃಶ್ಯ ಅಥವಾ ಪ್ರಸ್ತುತಿ ಪರಿಣಾಮಗಳನ್ನು ಸಿಎಸ್ಎಸ್ ನಿರ್ವಹಿಸಬೇಕು. ಮತ್ತು CSS3 ಅಂಶಗಳನ್ನು ಮಾರ್ಕ್ಯೂ ಪರಿಣಾಮವನ್ನು ಸೇರಿಸಲು ಹೇಗೆ ನಿಯಂತ್ರಿಸಲು ಮಾರ್ಕ್ಯೂ ಮಾಡ್ಯೂಲ್ ಸೇರಿಸುತ್ತದೆ.
ಹೊಸ CSS3 ಗುಣಲಕ್ಷಣಗಳು
CSS3 ನಿಮ್ಮ ವಿಷಯವು ಮಾರ್ಕ್ಯೂನಲ್ಲಿ ಹೇಗೆ ಪ್ರದರ್ಶಿಸುತ್ತದೆ ಎಂಬುದನ್ನು ನಿಯಂತ್ರಿಸಲು ಐದು ಹೊಸ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಸೇರಿಸುತ್ತದೆ: ಓವರ್ ಫ್ಲೋ-ಶೈಲಿಯ, ಮಾರ್ಕ್ಯೂ-ಶೈಲಿಯ, ಮಾರ್ಕ್ಯೂ-ಪ್ಲೇ-ಎಣಿಕೆ, ಮಾರ್ಕ್ಯೂ-ದಿಕ್ಕಿನಲ್ಲಿ ಮತ್ತು ಮಾರ್ಕ್ಯೂ-ವೇಗ.
ಓವರ್ಫ್ಲೋ ಶೈಲಿಯ
ವಿಷಯದ ಪೆಟ್ಟಿಗೆಯನ್ನು ಉರುಳಿಸುವಂತಹ ವಿಷಯಗಳಿಗಾಗಿ ಆವರ್ತನ ಶೈಲಿಯ ಆಸ್ತಿ (ನಾನು ಲೇಖನದಲ್ಲಿ ಸಿಎಸ್ಎಸ್ ಓವರ್ ಫ್ಲೋನಲ್ಲಿ ಚರ್ಚಿಸಿದ್ದೇನೆ) ಆದ್ಯತೆಯ ಶೈಲಿಯನ್ನು ವರ್ಣಿಸುತ್ತದೆ. ನೀವು ಮಾರ್ಕ್ಯೂ-ಲೈನ್ ಅಥವಾ ಮಾರ್ಕ್ಯೂ ಬ್ಲಾಕ್ಗೆ ಮೌಲ್ಯವನ್ನು ಹೊಂದಿಸಿದರೆ ನಿಮ್ಮ ವಿಷಯವು ಎಡ / ಬಲಕ್ಕೆ (ಮಾರ್ಕ್ಯೂ-ಲೈನ್) ಅಥವಾ ಅಪ್ / ಡೌನ್ (ಮಾರ್ಕ್ಯೂ-ಬ್ಲಾಕ್) ಗೆ ಸ್ಲೈಡ್ ಆಗುತ್ತದೆ.
ಮಾರ್ಕ್ಯೂ ಶೈಲಿಯ
ಈ ಗುಣಲಕ್ಷಣವು ವಿಷಯವು (ಮತ್ತು ಔಟ್) ಹೇಗೆ ಚಲಿಸುತ್ತದೆ ಎಂಬುದನ್ನು ವರ್ಣಿಸುತ್ತದೆ.
ಆಯ್ಕೆಗಳು ಸ್ಕ್ರಾಲ್, ಸ್ಲೈಡ್ ಮತ್ತು ಪರ್ಯಾಯವಾಗಿದೆ. ಸ್ಕ್ರಾಲ್ ಸಂಪೂರ್ಣವಾಗಿ ಪರದೆಯಿಂದ ಹೊರಬರುವ ವಿಷಯದೊಂದಿಗೆ ಪ್ರಾರಂಭವಾಗುತ್ತದೆ, ಮತ್ತು ಅದು ಗೋಚರ ಪ್ರದೇಶದಲ್ಲೆಲ್ಲಾ ಚಲಿಸುತ್ತದೆ. ಸ್ಲೈಡ್ ಸಂಪೂರ್ಣವಾಗಿ ತೆರೆದ ವಿಷಯದೊಂದಿಗೆ ಪ್ರಾರಂಭವಾಗುತ್ತದೆ ಮತ್ತು ನಂತರ ವಿಷಯವು ಪರದೆಯ ಮೇಲೆ ಸಂಪೂರ್ಣವಾಗಿ ತೆರಳುವವರೆಗೂ ಚಲಿಸುತ್ತದೆ ಮತ್ತು ಪರದೆಯ ಮೇಲೆ ಸ್ಲೈಡ್ ಮಾಡಲು ಹೆಚ್ಚಿನ ವಿಷಯವಿಲ್ಲ.
ಕೊನೆಯದಾಗಿ, ಪಕ್ಕದಿಂದ ಹಿಡಿದು ವಿಷಯವನ್ನು ಮುಂದಕ್ಕೆ ತಿರುಗಿಸಿ ಪರ್ಯಾಯವಾಗಿ ಬೌನ್ಸ್ ಮಾಡುತ್ತದೆ.
ಮಾರ್ಕ್ಯೂ-ಪ್ಲೇ-ಕೌಂಟ್
MARQUEE ಅಂಶವನ್ನು ಬಳಸುವ ನ್ಯೂನತೆಯೆಂದರೆ ಮಾರ್ಕ್ಯೂ ಎಂದಿಗೂ ನಿಲ್ಲುವುದಿಲ್ಲ. ಆದರೆ ಶೈಲಿ ಆಸ್ತಿ ಮಾರ್ಕ್ಯೂ-ಪ್ಲೇ ಎಣಿಕೆ ನೀವು ನಿರ್ದಿಷ್ಟ ಸಂಖ್ಯೆಯ ಬಾರಿ ವಿಷಯ ತಿರುಗಿಸಲು ಮಾರ್ಕ್ಯೂ ಹೊಂದಿಸಬಹುದು.
ಮಾರ್ಕ್ಯೂ-ದಿಕ್ಕಿನಲ್ಲಿ
ವಿಷಯ ಪರದೆಯ ಮೇಲೆ ಸ್ಕ್ರಾಲ್ ಮಾಡುವ ದಿಕ್ಕನ್ನೂ ನೀವು ಆಯ್ಕೆ ಮಾಡಬಹುದು. ಓವರ್ಫ್ಲೋ-ಶೈಲಿಯು ಮಾರ್ಕ್ಯೂ-ಬ್ಲಾಕ್ ಆಗಿದ್ದಾಗ ಮೇಲ್ಪ್ರವಾಹ-ಶೈಲಿಯು ಮಾರ್ಕ್ಯೂ-ಲೈನ್ ಮತ್ತು ಮೇಲಕ್ಕೆ ಅಥವಾ ಕೆಳಗಿರುವಾಗ ಪಠ್ಯದ ನಿರ್ದೇಶನವನ್ನು ಆಧರಿಸಿ ಮೌಲ್ಯಗಳು ಮುಂದಕ್ಕೆ ಮತ್ತು ಹಿಮ್ಮುಖವಾಗಿರುತ್ತವೆ.
ಮಾರ್ಕ್ಯೂ-ನಿರ್ದೇಶನ ವಿವರಗಳು
| ಓವರ್ಫ್ಲೋ ಶೈಲಿಯ | ಭಾಷಾ ನಿರ್ದೇಶನ | ಮುಂದೆ | ರಿವರ್ಸ್ |
|---|---|---|---|
| ಮಾರ್ಕ್ಯೂ-ಲೈನ್ | ltr | ಎಡಕ್ಕೆ | ಸರಿ |
| ಆರ್ಟಿಎಲ್ | ಸರಿ | ಎಡಕ್ಕೆ | |
| ಮಾರ್ಕ್ಯೂ ಬ್ಲಾಕ್ | ಅಪ್ | ಕೆಳಗೆ |
ಮಾರ್ಕ್ಯೂ-ವೇಗ
ಈ ಆಸ್ತಿ ಪರದೆಯ ಮೇಲೆ ವಿಷಯ ಸ್ಕ್ರಾಲ್ಗಳನ್ನು ಎಷ್ಟು ಬೇಗನೆ ನಿರ್ಧರಿಸುತ್ತದೆ. ಮೌಲ್ಯಗಳು ನಿಧಾನ, ಸಾಮಾನ್ಯ ಮತ್ತು ವೇಗವಾಗಿರುತ್ತವೆ. ನಿಜವಾದ ವೇಗವು ವಿಷಯವನ್ನು ಮತ್ತು ಬ್ರೌಸರ್ ಅನ್ನು ಪ್ರದರ್ಶಿಸುವ ಮೇಲೆ ಅವಲಂಬಿತವಾಗಿರುತ್ತದೆ, ಆದರೆ ಮೌಲ್ಯಗಳು ನಿಧಾನವಾಗಿರಬೇಕು, ಅದು ಸಾಮಾನ್ಯಕ್ಕಿಂತ ನಿಧಾನವಾಗಿರಬೇಕು ಮತ್ತು ವೇಗಕ್ಕಿಂತ ನಿಧಾನವಾಗಿರುತ್ತದೆ.
ಮಾರ್ಕ್ಯೂ ಗುಣಲಕ್ಷಣಗಳ ಬ್ರೌಸರ್ ಬೆಂಬಲ
ಸಿಎಸ್ಎಸ್ ಮಾರ್ಕ್ಯೂ ಅಂಶಗಳು ಕೆಲಸ ಮಾಡಲು ನೀವು ಮಾರಾಟಗಾರ ಪೂರ್ವಪ್ರತ್ಯಯಗಳನ್ನು ಬಳಸಬೇಕಾಗಬಹುದು. ಅವು ಹೀಗಿವೆ:
| CSS3 | ಮಾರಾಟಗಾರ ಪೂರ್ವಪ್ರತ್ಯಯ |
|---|---|
| ಓವರ್ಫ್ಲೋ-ಎಕ್ಸ್: ಮಾರ್ಕ್ಯೂ-ಲೈನ್; | ಓವರ್ಫ್ಲೋ-ಎಕ್ಸ್: -ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ; |
| ಮಾರ್ಕ್ಯೂ ಶೈಲಿಯ | -ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ ಶೈಲಿಯ |
| ಮಾರ್ಕ್ಯೂ-ಪ್ಲೇ-ಕೌಂಟ್ | -ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ-ಪುನರಾವರ್ತನೆ |
| ಮಾರ್ಕ್ಯೂ-ದಿಕ್ಕಿನಲ್ಲಿ: ಮುಂದಕ್ಕೆ | ರಿವರ್ಸ್; | -ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ-ದಿಕ್ಕಿನಲ್ಲಿ: ಮುಂದಕ್ಕೆ | ಹಿಂದಕ್ಕೆ; |
| ಮಾರ್ಕ್ಯೂ-ವೇಗ | -ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ-ವೇಗ |
| ಸಮಾನವಾಗಿಲ್ಲ | -ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ-ಇನ್ಕ್ರಿಮೆಂಟ್ |
ಮಾರ್ಕ್ಯೂ ಪರದೆಯಲ್ಲಿನ ವಿಷಯದ ಸುರುಳಿಗಳು ಎಷ್ಟು ದೊಡ್ಡ ಅಥವಾ ಚಿಕ್ಕದಾಗಿದೆ ಎಂದು ಹಂತಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸಲು ಕೊನೆಯ ಆಸ್ತಿ ನಿಮ್ಮನ್ನು ಅನುಮತಿಸುತ್ತದೆ.
ನಿಮ್ಮ ಮಾರ್ಕ್ಯೂ ಕೆಲಸ ಮಾಡಲು, ಮೊದಲು ನೀವು ಮೊದಲು ಮಾರಾಟಗಾರರ ಪೂರ್ವಸೂಚಕ ಮೌಲ್ಯಗಳನ್ನು ಇರಿಸಬೇಕು ಮತ್ತು ನಂತರ ಅವುಗಳನ್ನು CSS3 ನಿರ್ದಿಷ್ಟ ಮೌಲ್ಯಗಳನ್ನು ಅನುಸರಿಸಿ. ಉದಾಹರಣೆಗೆ, ಇಲ್ಲಿ 200x50 ಬಾಕ್ಸ್ ಒಳಗೆ ಎಡದಿಂದ ಬಲಕ್ಕೆ ಐದು ಬಾರಿ ಪಠ್ಯವನ್ನು ಸ್ಕ್ರಾಲ್ ಮಾಡುವ ಮಾರ್ಕ್ಯೂಗಾಗಿ ಸಿಎಸ್ಎಸ್ ಆಗಿದೆ.
{
ಅಗಲ: 200px; ಎತ್ತರ: 50 px; ಬಿಳಿಯ-ಸ್ಥಳ: ಈಗ್ರಾಪ್;
ಓವರ್ಫ್ಲೋ: ಮರೆಮಾಡಲಾಗಿದೆ;
ಓವರ್ಫ್ಲೋ-ಎಕ್ಸ್: -ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ;
-ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ-ದಿಕ್ಕಿನಲ್ಲಿ: ಮುಂದಕ್ಕೆ;
-ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ ಶೈಲಿಯ: ಸ್ಕ್ರಾಲ್;
-ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ-ವೇಗ: ಸಾಮಾನ್ಯ;
-ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ-ಇನ್ಕ್ರಿಮೆಂಟ್: ಸಣ್ಣ;
-ವೆಬ್ಕಿಟ್-ಮಾರ್ಕ್ಯೂ-ಪುನರಾವರ್ತನೆ: 5;
ಓವರ್ಫ್ಲೋ-ಎಕ್ಸ್: ಮಾರ್ಕ್ಯೂ-ಲೈನ್;
ಮಾರ್ಕ್ಯೂ-ದಿಕ್ಕಿನಲ್ಲಿ: ಮುಂದಕ್ಕೆ;
ಮಾರ್ಕ್ಯೂ ಶೈಲಿಯ: ಸ್ಕ್ರಾಲ್;
ಮಾರ್ಕ್ಯೂ-ವೇಗ: ಸಾಮಾನ್ಯ;
ಮಾರ್ಕ್ಯೂ-ಪ್ಲೇ-ಕೌಂಟ್: 5;
}