ಸಿಎಸ್ಎಸ್ನಲ್ಲಿ ಮತ್ತು ಸ್ವಲ್ಪ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ನೊಂದಿಗೆ 29 ಉತ್ತಮ ವಿನ್ಯಾಸದ ಸಮಯಸೂಚಿಗಳು

ಸ್ಕ್ರೋಲ್ ಟೈಮ್‌ಲೈನ್

ಟೈಮ್‌ಲೈನ್‌ಗಳು ಅಥವಾ ಟೈಮ್‌ಲೈನ್‌ಗಳು ನಮಗೆ ಮಾಡಬಹುದಾದ ಹೆಚ್ಚುವರಿ ಅಂಶಗಳಲ್ಲಿ ಒಂದಾಗಿದೆ ಪ್ರಗತಿ ಅಥವಾ ವಿಕಾಸವನ್ನು ತೋರಿಸಲು ವೆಬ್‌ಸೈಟ್‌ನಲ್ಲಿ ಸಂಯೋಜಿಸಿ ಕಂಪನಿ ಅಥವಾ ಕಂಪನಿಯ ವರ್ಷಗಳಲ್ಲಿ. ಮುದ್ರಣಕಲೆ ಮತ್ತು ದೃಶ್ಯ ಅಂಶಗಳೊಂದಿಗೆ ಅದನ್ನು ಹೇಗೆ ಸೊಗಸಾಗಿ ರಚಿಸುವುದು ಎಂದು ತಿಳಿದುಕೊಳ್ಳುವುದರಿಂದ, ಕಾಲಾನಂತರದಲ್ಲಿ ಸೇವೆ ಅಥವಾ ಉತ್ಪನ್ನವು ತೆಗೆದುಕೊಂಡ ಕ್ರಮಗಳನ್ನು ತೋರಿಸಬಹುದು.

ನೀವು ಕೆಳಗೆ ಕಾಣುವ ಈ 29 ಟೈಮ್‌ಲೈನ್‌ಗಳು ಲಂಬ ಟೈಮ್‌ಲೈನ್‌ಗಳಿಂದ ಅಡ್ಡಲಾಗಿರುವಂತೆ. ಕ್ಲೈಂಟ್‌ಗಾಗಿ ಅಥವಾ ನಿಮಗಾಗಿ ನೀವು ಅಭಿವೃದ್ಧಿಪಡಿಸುತ್ತಿರುವ ವೆಬ್‌ಸೈಟ್‌ನ ಪುಟದಲ್ಲಿ ಅದನ್ನು ಕಂಡುಹಿಡಿಯಲು ನಿಮ್ಮ ಅಗತ್ಯಗಳಿಗೆ ಸೂಕ್ತವಾದ ಅತ್ಯುತ್ತಮವಾದದನ್ನು ನೀವು ಕಾಣಬಹುದು. ನಾವು ದೃಷ್ಟಿಗೆ ಆಹ್ಲಾದಕರವಾದ ಅತ್ಯಂತ ಆಸಕ್ತಿದಾಯಕ ಟೈಮ್‌ಲೈನ್‌ಗಳ ಸಂಗ್ರಹದೊಂದಿಗೆ ಹೋಗುತ್ತಿದ್ದೇವೆ.

ಸೂಚ್ಯಂಕ

ಸ್ಕ್ರೋಲಿಂಗ್ ಮೂಲಕ ಟೈಮ್‌ಲೈನ್

ಸ್ಕ್ರೋಲ್ ಟೈಮ್‌ಲೈನ್

HTML, CSS, ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಕೋಡ್‌ನಲ್ಲಿರುವ ಟೈಮ್‌ಲೈನ್ ತನ್ನನ್ನು ಮನೋಹರವಾಗಿ ಇರಿಸಿಕೊಳ್ಳಲು a ಉತ್ತಮ ಕನಿಷ್ಠ ಇದು ಎಡಭಾಗದಲ್ಲಿರುವ ವರ್ಷಗಳ ಪಟ್ಟಿಗೆ ಉಚ್ಚಾರಣೆಯನ್ನು ಕೆಂಪು ಬಣ್ಣದಲ್ಲಿ ಮತ್ತು ಟೈಪ್‌ಫೇಸ್ ಮತ್ತು H2 ಗಳಿಗೆ ಕಪ್ಪು ಬಣ್ಣದಲ್ಲಿ ಇರಿಸುತ್ತದೆ. ಈ ಟೈಮ್‌ಲೈನ್‌ನ ಉತ್ತಮ ವಿಷಯವೆಂದರೆ ನೀವು ಪುಟವನ್ನು ಸ್ಕ್ರಾಲ್ ಮಾಡುವಾಗ, ವರ್ಷದ ಬದಲಾವಣೆಯನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಮಾಡಲಾಗುತ್ತದೆ. ಉತ್ತಮ ಫಿನಿಶ್, ವಿನ್ಯಾಸ ಮತ್ತು ಫಲಿತಾಂಶ.

ಸಿಎಸ್ಎಸ್ನಲ್ಲಿ ಟೈಮ್ಲೈನ್

ಸಿಎಸ್ಎಸ್ ಟೈಮ್ಲೈನ್ ​​ಗುಣಲಕ್ಷಣಗಳು

ಈ ಟೈಮ್‌ಲೈನ್ ಸಿಎಸ್ಎಸ್ ಕೋಡ್ ಅನ್ನು ಅದರ ಕೆಲವು ಗುಣಲಕ್ಷಣಗಳಲ್ಲಿ ಸರಿಯಾಗಿ ಕಾನ್ಫಿಗರ್ ಮಾಡಲು ಸಹ ಬಳಸುತ್ತದೆ. ಇದು ಸ್ಕ್ರೋಲಿಂಗ್ ಹೊಂದಿಲ್ಲ ಹಿಂದಿನಂತೆಯೇ, ಆದರೆ ಇದು ಪೆಟ್ಟಿಗೆಗಳ ಸರಣಿ ಮತ್ತು ನೀಲಿ ಬಣ್ಣದಿಂದ ನಿರೂಪಿಸಲ್ಪಟ್ಟಿದೆ ಮತ್ತು ಇದು ಮತ್ತೊಂದು ಸೊಗಸಾದ ಸ್ಪರ್ಶವನ್ನು ನೀಡುತ್ತದೆ ಮತ್ತು ಈ ಪ್ರಕಟಣೆಯ ಸಮಯದ ಪಟ್ಟಿಗೆ ಸೇರಿಸುತ್ತದೆ.

ಜವಾಬ್ದಾರಿಯುತ ಟೈಮ್‌ಲೈನ್ ಸ್ಲೈಡರ್

ಜವಾಬ್ದಾರಿಯುತ ಟೈಮ್‌ಲೈನ್ ಸ್ಲೈಡರ್

ಎಚ್ಟಿಎಮ್ಎಲ್, ಸಿಎಸ್ಎಸ್ ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಕೋಡ್ ಅನ್ನು ಸೇರಿಸಲು ಈ ಟೈಮ್ಲೈನ್ ​​ಅನ್ನು ಸ್ವೈಪರ್ ಜೆಎಸ್ ಲೈಬ್ರರಿಯೊಂದಿಗೆ ಮಾಡಲಾಗಿದೆ. ನಾವು ವೆಬ್ ಪುಟದ ಮೂಲಕ ಪ್ರಗತಿಯಲ್ಲಿರುವಾಗ ಅದು ಸ್ಕ್ರೋಲಿಂಗ್ ಹೊಂದಿಲ್ಲ, ಆದರೆ ಅದು ಮಾಡುತ್ತದೆ ವರ್ಷಗಳನ್ನು ಬಲಭಾಗದಲ್ಲಿ ಇರಿಸುತ್ತದೆ ಮತ್ತು ನಿರ್ದಿಷ್ಟ ವರ್ಷಕ್ಕೆ ಹೋಗಲು ಮೌಸ್ ಪಾಯಿಂಟರ್ ಅನ್ನು ಬಳಸುವುದರ ಹೊರತಾಗಿ ನಾವು ಮುಂದಿನದಕ್ಕೆ ಹೋಗಬಹುದಾದ ಬಟನ್. ಪ್ರತಿಯೊಂದು ಪರಿವರ್ತನೆಗಳಲ್ಲಿ ಉತ್ತಮ ಅನಿಮೇಷನ್.

ಸುಧಾರಿತ ಟೈಮ್‌ಲೈನ್

ಸುಧಾರಿತ ಟೈಮ್‌ಲೈನ್

ಈ ಟೈಮ್‌ಲೈನ್ HTML, CSS ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಬಳಸುವುದರಲ್ಲಿ ಭಿನ್ನವಾಗಿದೆ ಏಕವರ್ಣದೊಳಗೆ ಹೋಗಿ, ನಿಖರವಾಗಿ ಕೆಂಪು ಸ್ವರಗಳಲ್ಲಿ. ಈ ಉತ್ತಮ ಫಲಿತಾಂಶ ಕೋಡ್‌ನಿಂದ ಗುರುತಿಸಲ್ಪಟ್ಟ ಟೈಮ್‌ಲೈನ್‌ನಲ್ಲಿ ಮುನ್ನಡೆಯಲು ಅಥವಾ ಹಿಂತಿರುಗಲು ನಿಮಗೆ ಅನುಮತಿಸುವ ಗುಂಡಿಯ ಬಳಕೆಯಿಂದಲೂ ಇದು ನಿರೂಪಿಸಲ್ಪಟ್ಟಿದೆ.

ಸ್ಥಿರ ಹೆಡರ್ ಮತ್ತು ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್‌ನೊಂದಿಗೆ ಟೈಮ್‌ಲೈನ್

ಟೈಮ್‌ಲೈನ್ ನಿವಾರಿಸಲಾಗಿದೆ

ಸ್ಥಿರ ಹೆಡರ್ಗಾಗಿ HTML ಮತ್ತು CSS ಕೋಡ್ ನಾವು ಸ್ಕ್ರೋಲಿಂಗ್ ಮಾಡುವ ಕ್ಷಣದಲ್ಲಿ ಅದು ಸ್ಥಿರವಾಗಿರುತ್ತದೆ ಪುಟದಲ್ಲಿ. ಪ್ರಸ್ತುತ ವೆಬ್ ವಿನ್ಯಾಸ ಮಾನದಂಡಗಳಿಗಾಗಿ ಎದ್ದು ಕಾಣಲು ಬಯಸುವ ಯಾವುದೇ ಪ್ರಸ್ತುತ ಡೆವಲಪರ್‌ಗೆ ಹೆಚ್ಚಿನ ಆಸಕ್ತಿಯ ಟೈಮ್‌ಲೈನ್ ಆಗಿರುವುದು ಬಹಳ ಸೂಕ್ಷ್ಮತೆಯಾಗಿದೆ.

ಪ್ರಾಜೆಕ್ಟ್ ಟೈಮ್‌ಲೈನ್

ಪ್ರಾಜೆಕ್ಟ್ ಟೈಮ್‌ಲೈನ್

ಈ ಟೈಮ್‌ಲೈನ್ ಸಿಎಸ್ಎಸ್ ಮತ್ತು ಎಚ್‌ಟಿಎಂಎಲ್ ಅನ್ನು ಬಳಸುತ್ತದೆ ಆ ನಿರ್ದಿಷ್ಟ ಅವಧಿ ಯೋಜನೆಗಾಗಿ. ನಾವು ಸ್ಕ್ರೋಲ್ ಮಾಡುವಾಗ ಅದು ವಾರದ ದಿನಗಳಲ್ಲಿ ಸಾಗುತ್ತದೆ, ಆದ್ದರಿಂದ ಕಂಪನಿಯು ಸ್ವತಃ ತಯಾರಿಸಿದ ಸಹಕಾರಿ ಸಾಧನಗಳಿಗಾಗಿ ಅದನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸುವುದು ಸೂಕ್ತವಾಗಿದೆ.

ಟೈಮ್ಲೈನ್

ಟೈಮ್ಲೈನ್

ಒಂದು ಟೈಮ್‌ಲೈನ್ HTML, CSS ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಉಳಿದವುಗಳಿಂದ ಭಿನ್ನವಾಗಿದೆ ದೃಶ್ಯ ಥೀಮ್ಗಾಗಿ. ಮತ್ತು ನಾವು ಲಂಬ ಟೈಮ್‌ಲೈನ್ ಮೂಲಕ ಸ್ಕ್ರಾಲ್ ಮಾಡುವಾಗ, ಪ್ರತಿ ಬಾರಿ ನಾವು ಟೈಮ್‌ಲೈನ್‌ನಲ್ಲಿ ಹೊಸ photograph ಾಯಾಚಿತ್ರವನ್ನು ಕಂಡುಕೊಂಡಾಗ, ಅದು ನಾವು ಈ ಕೋಡ್ ಅನ್ನು ಇರಿಸಿರುವ ವೆಬ್ ಪುಟದ ಹಿನ್ನೆಲೆ ಚಿತ್ರವಾಗಿ ಪರಿಣಮಿಸುತ್ತದೆ.

ಹೈಪರ್ಲೋಪ್

ಹೈಪರ್ಲೋಪ್

ಹೈಪರ್ಲೂಪು ಒಂದು ಟೈಮ್‌ಲೈನ್ ಆಗಿದೆ ಬದಲಿಗೆ ಬಳಸಿದ ವಿನ್ಯಾಸಕ್ಕಾಗಿ ಎದ್ದು ಕಾಣುತ್ತದೆ ಮತ್ತು HTML ಮತ್ತು CSS ಗಿಂತ ಹೆಚ್ಚೇನೂ ಪ್ರೋಗ್ರಾಮ್ ಮಾಡಲಾಗಿಲ್ಲ. ಪಠ್ಯ ಫಾಂಟ್‌ನಲ್ಲಿ ಲಂಬ ರೇಖೆ ಮತ್ತು ಟೈಮ್‌ಲೈನ್‌ನ ಪ್ರತಿಯೊಂದು ಪ್ರಮುಖ ಕ್ಷಣವನ್ನು ಗುರುತಿಸುವ ಪೆಟ್ಟಿಗೆಗಳ ಸರಣಿಯೊಂದಿಗೆ ವಿಭಿನ್ನ ಗಾತ್ರಗಳ ಬಳಕೆಯಿಂದ ಇದು ನಿರೂಪಿಸಲ್ಪಟ್ಟಿದೆ.

ಲಂಬ ಟೈಮ್‌ಲೈನ್

ಲಂಬ ಟೈಮ್‌ಲೈನ್

ಅದು ಮಧ್ಯಂತರ ಟೈಮ್‌ಲೈನ್ ತನ್ನ ದೃಶ್ಯ ಸ್ಪರ್ಶದಿಂದ ಉಳಿದವರಿಂದ ದೂರವಿರುತ್ತಾನೆ. ಇದು ವಿನ್ಯಾಸದಲ್ಲಿ ಪ್ರಸ್ತುತ ಗ್ರೇಡಿಯಂಟ್ ಹಿನ್ನೆಲೆ ಮತ್ತು ಆ ಪ್ರತಿಯೊಂದು ಮಧ್ಯಂತರಗಳನ್ನು ಗುರುತಿಸುವ ಪೆಟ್ಟಿಗೆಗಳ ಸರಣಿಯನ್ನು ಹೊಂದಿದೆ. CSS ಮತ್ತು HTML ನಲ್ಲಿ ಪ್ರೋಗ್ರಾಮ್ ಮಾಡಲಾಗಿದೆ.

ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್‌ನಲ್ಲಿ ಟೈಮ್‌ಲೈನ್

ಟೈಮ್‌ಲೈನ್ ಫ್ಲೆಕ್ಸ್‌ಬಾಕ್ಸ್

ಅತ್ಯುತ್ತಮವಾದ ಟೈಮ್‌ಲೈನ್‌ಗಳಲ್ಲಿ ಒಂದಾಗಿದೆ ಮತ್ತು ಅದು ಕಾರ್ಡ್‌ಗಳನ್ನು ಆಧರಿಸಿದೆ ಆ ಸಮಯದ ಮಧ್ಯಂತರಕ್ಕೆ ನಮಗೆ ಬೇಕಾದ ಎಲ್ಲಾ ಮಾಹಿತಿಯನ್ನು ಸೇರಿಸಲು. HTML ಮತ್ತು CSS ನಲ್ಲಿಯೂ ಸಹ ಅಭಿವೃದ್ಧಿಪಡಿಸಲಾಗಿದೆ, ದೊಡ್ಡ ಪರದೆಯ ಸ್ಥಳವನ್ನು ಲೆಕ್ಕಹಾಕಲು ಎಲ್ಲಾ ಕಾರ್ಡ್‌ಗಳು ಒಂದೇ ಎತ್ತರ ಮತ್ತು ಅಗಲವನ್ನು ಹೊಂದಿರಬೇಕು ಎಂಬುದನ್ನು ಗಣನೆಗೆ ತೆಗೆದುಕೊಳ್ಳಬೇಕು.

ಡಿಐವಿಯಲ್ಲಿ ಟೈಮ್‌ಲೈನ್

ಟೈಮ್ಲೈನ್ ​​ಡಿವ್

ವಿನ್ಯಾಸದಲ್ಲಿ ಕನಿಷ್ಠ ಟೈಮ್‌ಲೈನ್ ಮತ್ತು ಅದು HTML ಮತ್ತು CSS ನಲ್ಲಿ ಮಾತ್ರ ಅಭಿವೃದ್ಧಿಪಡಿಸಲಾಗಿದೆ, ಆದ್ದರಿಂದ ಅದರ ಅನುಷ್ಠಾನವು ತುಂಬಾ ವೇಗವಾಗಿರುತ್ತದೆ. ಏಕವರ್ಣದ ಮುಕ್ತಾಯದಿಂದಾಗಿ ಮಾಹಿತಿ ಮಾಧ್ಯಮದಲ್ಲಿ ಟೈಮ್‌ಲೈನ್ ಅನ್ನು ವ್ಯಕ್ತಪಡಿಸಲು ಇದು ಸಂಪೂರ್ಣವಾಗಿ ಸೂಕ್ತವಾಗಿರುತ್ತದೆ.

CSS ಮತ್ತು HTML ನಲ್ಲಿ ಟೈಮ್‌ಲೈನ್

ಸಿಎಸ್ಎಸ್ ಟೈಮ್ಲೈನ್

ನೀವು ಇರಿಸಬಹುದು 400 × 300 ಗಾತ್ರದ ಚಿತ್ರಗಳು ಈ ಟೈಮ್‌ಲೈನ್‌ನಲ್ಲಿ ರೇಖೆಗಳ ಹಸಿರು ಬಣ್ಣ ಮತ್ತು ದಿನಾಂಕಗಳು ಮತ್ತು ದಿನಗಳ ಪಠ್ಯದಿಂದ ಗುರುತಿಸಲಾಗಿದೆ. ಇದು ಯಾವುದೇ ಅನಿಮೇಷನ್ಗಳನ್ನು ಹೊಂದಿಲ್ಲ ಮತ್ತು ಎಲ್ಲಾ ಹಂತಗಳಲ್ಲಿ ಅದರ ಸರಳ ವಿನ್ಯಾಸದಿಂದ ನಿರೂಪಿಸಲ್ಪಟ್ಟಿದೆ.

ಪ್ರತಿಕ್ರಿಯೆಗಳು ಮತ್ತು ಪ್ರತಿಕ್ರಿಯೆ ಟೈಮ್‌ಲೈನ್

ಟೈಮ್‌ಲೈನ್ ಕಾಮೆಂಟ್‌ಗಳು

ಅನುಮತಿಸಲು ಇತರರಿಗಿಂತ ಟೈಮ್‌ಲೈನ್ ತುಂಬಾ ಭಿನ್ನವಾಗಿದೆ ಬಳಕೆದಾರರ ಫೋಟೋಗಳೊಂದಿಗೆ ಕಾರ್ಡ್‌ಗಳನ್ನು ಇರಿಸಿ, ಅಥವಾ ಕನಿಷ್ಠ ಅದು ಮೊದಲಿಗೆ ಉದ್ದೇಶವಾಗಿದೆ. ಉತ್ತಮ ದೃಶ್ಯ ಶೈಲಿಯೊಂದಿಗೆ, ಕಾರ್ಡ್‌ಗಳು ಅನಿಮೇಷನ್‌ಗಳಿಲ್ಲದೆ ಸಮತಟ್ಟಾದ ಟೈಮ್‌ಲೈನ್‌ಗಾಗಿ ding ಾಯೆಯನ್ನು ಬಳಸುತ್ತವೆ.

HTML ಮತ್ತು CSS ನಲ್ಲಿ ಟೈಮ್‌ಲೈನ್ ಬೆಳಿಗ್ಗೆ

ಜವಾಬ್ದಾರಿಯುತ ಟೈಮ್‌ಲೈನ್

ಅದಕ್ಕೆ ಸ್ಪಂದಿಸುವ ಪರಿಪೂರ್ಣ ಟೈಮ್‌ಲೈನ್ ಇದನ್ನು HTML, CSS ಎಂದು ನಿರೂಪಿಸಲಾಗಿದೆ ಮತ್ತು ಸಾಕಷ್ಟು ಸರಳವಾದ ಆದರೆ ಮೊಬೈಲ್ ಟೈಮ್‌ಲೈನ್ ಅನ್ನು ನೀಡಿ.

ಟೈಮ್‌ಲೈನ್ ಯುಐ

ಟೈಮ್ಲೈನ್

HTML ಮತ್ತು CSS ನಲ್ಲಿನ ಈ ಕೋಡ್ ಸಂಪೂರ್ಣವಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ ಕೆಲಸದ ದಿನವನ್ನು ಪ್ರಸ್ತುತಪಡಿಸಿ ತಾಲೀಮು. ಇದು ಹೆಡರ್ ಇಮೇಜ್ ಮತ್ತು ಗುಂಡಿಗಳ ಸರಣಿಯೊಂದಿಗೆ ಸ್ಪಂದಿಸುತ್ತದೆ, ಅದು ದೃಷ್ಟಿಗೋಚರ ಅಂಶದಲ್ಲಿ ಅದನ್ನು ಸ್ಪಷ್ಟ ಮತ್ತು ಸ್ವಚ್ way ರೀತಿಯಲ್ಲಿ ತೋರಿಸುತ್ತದೆ.

ಸಿಎಸ್‌ಎಸ್‌ನಲ್ಲಿ ಮಾತ್ರ ಟೈಮ್‌ಲೈನ್

ಸಿಎಸ್ಎಸ್ ಟೈಮ್ಲೈನ್

ಈ ಟೈಮ್‌ಲೈನ್ ಅನ್ನು ಸಿಎಸ್‌ಎಸ್‌ನಲ್ಲಿರುವ ಮೂಲಕ ಮತ್ತು ಎ ಚೆನ್ನಾಗಿ ಆಯ್ಕೆ ಮಾಡಿದ ಬಣ್ಣಗಳ ಸರಣಿ: ಕೆಂಪು ಮತ್ತು ಹಸಿರು. ಇಡೀ ಪುಟವನ್ನು ಸಂಪೂರ್ಣವಾಗಿ ಆವರಿಸಲು ಹಸಿರು, ಪಠ್ಯ ಮತ್ತು ವಿಭಜಿಸುವ ರೇಖೆಗಳಿಗೆ ಬಿಳಿ, ಮತ್ತು ನಾವು ಇರುವ ಸಮಯದ ಮಧ್ಯಂತರವನ್ನು ಪ್ರತ್ಯೇಕಿಸಲು ಕೆಂಪು. ನಾವು ಪ್ರತಿ ಮಧ್ಯಂತರವನ್ನು ಕ್ಲಿಕ್ ಮಾಡಿ ಅದನ್ನು ಸುತ್ತುವರೆದಿರುವ ಪೆಟ್ಟಿಗೆಯೊಂದಿಗೆ ಇರಿಸಲು ಮತ್ತು ಅದನ್ನು ಹೈಲೈಟ್ ಮಾಡಬಹುದು.

ರೆಸ್ಪಾನ್ಸಿವ್ ಟೈಮ್‌ಲೈನ್ ವಿ 3

ರೆಸ್ಪಾನ್ಸಿವ್ ಟೈಮ್‌ಲೈನ್ ವಿ 3

HTML, CSS ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್‌ನಲ್ಲಿನ ಪಟ್ಟಿಯಲ್ಲಿರುವ ಸಮತಲ ಟೈಮ್‌ಲೈನ್‌ಗಳಲ್ಲಿ ಮೊದಲನೆಯದು. ದೃಷ್ಟಿಗೋಚರವಾಗಿ ನಿಂತಿದೆ ಕಪ್ಪು ಮತ್ತು ಬೂದು ಬಣ್ಣಗಳ ಬಳಕೆ ಬಿಂದುಗಳ ಸರಣಿಯೊಂದಿಗೆ ಸಮತಲ ರೇಖೆಯನ್ನು ಇರಿಸಲು. ಪ್ರತಿಯೊಂದು ಮಧ್ಯಂತರವನ್ನು ಮೂಲದಲ್ಲಿ ಮತ್ತು ಪಠ್ಯ ವಿಷಯದಲ್ಲಿ ಹೆಚ್ಚಿನ ತೂಕದೊಂದಿಗೆ ಹೈಲೈಟ್ ಮಾಡಲಾಗುತ್ತದೆ.

ಟೈಮ್‌ಲೈನ್ ಬಣ್ಣದಲ್ಲಿ ನೆಲೆಸಿದೆ

ನೆಸ್ಟೆಡ್

ಸಮತಲ ಟೈಮ್‌ಲೈನ್‌ಗಳಲ್ಲಿ ಒಂದು ಪಟ್ಟಿಯಲ್ಲಿ ಹೆಚ್ಚಿನ ದೃಶ್ಯ ಗುಣಮಟ್ಟ. ಪ್ರತಿ ಬಾರಿಯೂ ಸಮಯದ ಮಧ್ಯಂತರವನ್ನು ಒತ್ತಿದಾಗ ಉತ್ತಮ ಬಳಕೆದಾರ ಅನುಭವವನ್ನು ನೀಡಲು ಬಹಳ ಸೂಕ್ಷ್ಮ ಮತ್ತು ಉತ್ತಮವಾಗಿ ಪ್ರಸ್ತುತಪಡಿಸಿದ ಅನಿಮೇಷನ್‌ಗಳನ್ನು ಹೊಂದಿರುವ ಅತ್ಯಂತ ಸಂವಾದಾತ್ಮಕ ಟೈಮ್‌ಲೈನ್. ಇದನ್ನು ತಯಾರಿಸಲಾಗುತ್ತದೆ HTML CSS / Sass ಮತ್ತು JavaScript / TypeScript (jquery.js).

ಜವಾಬ್ದಾರಿಯುತ ಇತಿಹಾಸ ಟೈಮ್‌ಲೈನ್

ಪ್ರತಿಕ್ರಿಯಾಶೀಲರಾಗಿರುತ್ತಾರೆ ಕಥೆ

ಇದಕ್ಕಾಗಿ ಪರಿಪೂರ್ಣ ಟೈಮ್‌ಲೈನ್ ಚಿತ್ರಗಳಲ್ಲಿನ ವಿಭಿನ್ನ ಘಟನೆಗಳನ್ನು ತೋರಿಸಿ ಇತಿಹಾಸದಲ್ಲಿ ಸಮಯದ ಸ್ಲಾಟ್. ಎಚ್ಟಿಎಮ್ಎಲ್, ಸಿಎಸ್ಎಸ್ ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ನಲ್ಲಿ ಅಭಿವೃದ್ಧಿಪಡಿಸಲಾಗಿದೆ ಎಂದು ಇದು ಸಮತಲ ಮತ್ತು ಸ್ಪಂದಿಸುತ್ತದೆ.

ಗುಂಪು ಟೈಮ್‌ಲೈನ್

ಟೈಮ್‌ಲೈನ್ ಗುಂಪು

ಈ ಟೈಮ್‌ಲೈನ್ ಉತ್ತಮ ಪರಿವರ್ತನೆಗಾಗಿ ಎದ್ದು ಕಾಣುತ್ತದೆ ಸಮತಲ ಅನಿಮೇಷನ್‌ನೊಂದಿಗೆ ನಡೆಸಲಾಗುತ್ತದೆ. ಪ್ರತಿಯೊಂದು ಸಮಯದ ಮಧ್ಯಂತರಗಳನ್ನು ಹೈಲೈಟ್ ಮಾಡಲು ಉತ್ತಮ ಬಣ್ಣ ಮತ್ತು ಸೊಗಸಾದ ವಿನ್ಯಾಸ. ಪ್ರತಿನಿಧಿ ಹಿನ್ನೆಲೆ ಚಿತ್ರದ ಮೇಲೆ ಸೂಚಿತವಾಗಿರುವ ಕಾರ್ಡ್‌ಗಳ ಸರಣಿಯನ್ನು ಪ್ರಸ್ತುತಪಡಿಸಲು ಇದು HTML, CSS ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್‌ನಲ್ಲಿದೆ.

ಅಡ್ಡ ಸಿಎಸ್ಎಸ್ ಮತ್ತು ಎಚ್ಟಿಎಮ್ಎಲ್ ಟೈಮ್ಲೈನ್

ಅಡ್ಡ ಎನ್ವಾಟೋ

ಅವರಿಂದ ತಯಾರಿಸಲ್ಪಟ್ಟಿದೆ ತಿಳಿದಿರುವ ಎನ್ವಾಟೋ ಟಟ್ಸ್ +, ವಿನ್ಯಾಸದಲ್ಲಿ ಸ್ವಚ್ clean ಮತ್ತು ಮೂಲ ಕಾರ್ಡ್‌ಗಳ ಸರಣಿಯೊಂದಿಗೆ ನಮಗೆ ಸಮತಲ ಟೈಮ್‌ಲೈನ್ ಅನ್ನು ನೀಡಲಾಗುತ್ತದೆ. ಫ್ಲಾಟ್ ಬಣ್ಣಗಳು ಮತ್ತು ಪ್ರತಿ ಮಧ್ಯಂತರವನ್ನು ಇಂಟರ್ಲಾಕ್ ಮಾಡುವ ಕೆಂಪು ಚುಕ್ಕೆಗಳ ಸರಣಿಯೊಂದಿಗೆ ಸಮತಲವಾಗಿರುವ ರೇಖೆ.

ಟೈಮ್ಲೈನ್ ​​ಸಿಎಸ್ಎಸ್, ಎಚ್ಟಿಎಮ್ಎಲ್ ಮತ್ತು ಸ್ಲಿಕ್.ಜೆಎಸ್ 

ನೀಲಿಬಣ್ಣದ ಟೈಮ್‌ಲೈನ್

ಟೈಮ್‌ಲೈನ್‌ಗಾಗಿ ವಿನ್ಯಾಸದಲ್ಲಿ ನೀಲಿಬಣ್ಣದ ಟೋನ್ಗಳು ಪ್ರತಿಯೊಂದು ಚಿತ್ರಗಳ ಪ್ರಸ್ತುತಿಗಾಗಿ ಎದ್ದು ಕಾಣುತ್ತದೆ ಪ್ರತಿ ಸಮಯದ ಮಧ್ಯಂತರವನ್ನು ತೋರಿಸುತ್ತದೆ. ಪ್ರತಿಯೊಂದು ಚಿತ್ರಗಳು ಮತ್ತು ಮಧ್ಯಂತರಗಳ ನಡುವಿನ ಪರಿವರ್ತನೆಯೇ ಈ ಟೈಮ್‌ಲೈನ್ ಎದ್ದು ಕಾಣುವಂತೆ ಮಾಡುತ್ತದೆ.

ಟೈಮ್ಲೈನ್ ​​ಅನುಕ್ರಮ ವಿ ​​1

ಟೈಮ್ಲೈನ್ ​​ಅನುಕ್ರಮ

ಎದ್ದು ಕಾಣುವ ಟೈಮ್‌ಲೈನ್ ಪ್ರತಿ ಲಂಬ ರೇಖೆಯಲ್ಲಿನ ಗುಂಡಿಗಳು ಪ್ರತಿ ಬಾರಿ ನಾವು ಒಂದನ್ನು ಒತ್ತಿದಾಗ ಪೂರ್ಣ ಪರದೆಯ ಹಿನ್ನೆಲೆ ಚಿತ್ರವನ್ನು ಲಿಂಕ್ ಮಾಡಲು ಪ್ರತಿ ಮಧ್ಯಂತರ.

ಅಡ್ಡ ಟೈಮ್‌ಲೈನ್ HTML CSS

ಟೈಮ್‌ಲೈನ್ ಎಚ್‌ಆರ್

ಎ ನಿಂದ ಹೈಲೈಟ್ ಮಾಡಲಾದ ಈ ಟೈಮ್‌ಲೈನ್‌ನಲ್ಲಿ ಎಲ್ಲಿಯೂ ಕ್ಲಿಕ್ ಮಾಡಲು ನಿಮಗೆ ಸಾಧ್ಯವಾಗುವುದಿಲ್ಲ ಬಣ್ಣದ ಪ್ಯಾಲೆಟ್ನ ಬುದ್ಧಿವಂತ ಆಯ್ಕೆಯಿಂದ ಸೊಗಸಾದ ವಿನ್ಯಾಸ ಮತ್ತು ಪ್ರತಿಯೊಂದು ಟೈಮ್‌ಲೈನ್‌ಗಳಿಗೆ ಸ್ಯಾಂಡ್‌ವಿಚ್‌ಗಳ ಸರಣಿ. ಯಾವುದೇ ಅನಿಮೇಷನ್‌ಗಳಿಲ್ಲ, ಆದರೆ ದೃಷ್ಟಿಗೆ ಇದು ಕಣ್ಣಿಗೆ ತುಂಬಾ ಆಹ್ಲಾದಕರವಾಗಿರುತ್ತದೆ.

ಕೋಡಿಹೌಸ್ ಟೈಮ್‌ಲೈನ್

ಟೈಮ್‌ಲೈನ್ ಕೋಡಿಹೌಸ್

ಈ ಟೈಮ್‌ಲೈನ್ ಕೋಡಿಹೌಸ್ ಪ್ರಸ್ತುತಪಡಿಸಿದ ಏಕ ಬಣ್ಣ ವಿನ್ಯಾಸದಲ್ಲಿ ಮತ್ತು HTML, CSS ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್‌ನಲ್ಲಿ ಅಭಿವೃದ್ಧಿಪಡಿಸಲಾಗಿದೆ. ಇದು ಬಿಂದುಗಳ ಸರಣಿಯೊಂದಿಗೆ ಕನಿಷ್ಠ ರೇಖೆಯನ್ನು ಮಧ್ಯಂತರಗಳಂತೆ ಕ್ಲಿಕ್ ಮಾಡಲು ಮತ್ತು ಅರ್ಧ ಸೆಕೆಂಡ್‌ಗಿಂತ ಕಡಿಮೆ ಸಮತಲ ಅನಿಮೇಷನ್‌ಗೆ ಕಾರಣವಾಗುತ್ತದೆ. ಸರಳ, ಆದರೆ ಶಕ್ತಿಯುತ.

ಅಡ್ಡ ಟೈಮ್‌ಲೈನ್

ಅಡ್ಡ ಟೈಮ್‌ಲೈನ್

HTML, CSS ಮತ್ತು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್‌ನಲ್ಲಿ ಮಾಡಿದ ಮತ್ತೊಂದು ಟೈಮ್‌ಲೈನ್. ಒಂದೇ ಬಣ್ಣದಿಂದ ನಿರೂಪಿಸಲಾಗಿದೆ, ಇದು ಸಮಯದ ಮಧ್ಯಂತರಗಳನ್ನು ಪ್ರತಿನಿಧಿಸುವ ಪ್ರತಿಯೊಂದು ಬಿಂದುಗಳ ಮೇಲೆ ಲೇಸ್ ಅನ್ನು ಹಾಕಲು ಹಸಿರು ಬಣ್ಣವನ್ನು ಹೊಂದಿರುವ ಸೊಗಸಾದ ವಿನ್ಯಾಸವನ್ನು ಹೊಂದಿರುತ್ತದೆ. ಪ್ರತಿ ಬಾರಿ ನಾವು ಒಂದನ್ನು ಒತ್ತಿದಾಗ, ತುಂಬಾ ನಯವಾದ ಅಡ್ಡ ಅನಿಮೇಷನ್ ಪ್ರಾರಂಭವಾಗುತ್ತದೆ.

ಹೆಸರಿಸದ ಟೈಮ್‌ಲೈನ್

ಹೆಸರಿಸದ ಟೈಮ್‌ಲೈನ್

ಕೆಳಗಿನ ಪಟ್ಟಿಯಿಂದ ಮಾತ್ರ ಕಪ್ಪು ಟೈಮ್‌ಲೈನ್. ನಂತರ ಅವನು ಬಳಸುತ್ತಾನೆ ಪ್ರತಿ ವರ್ಷ ಮತ್ತು ಪಠ್ಯವನ್ನು ಪ್ರತ್ಯೇಕಿಸಲು ವಿಭಿನ್ನ ಬಣ್ಣಗಳು ಅದೇ ಸಮಯದಲ್ಲಿ ಅದರ ಮಿತಿಗಳು. ಪ್ರತಿಯೊಂದು ಪಠ್ಯಗಳ ನಡುವೆ ಹಾದುಹೋಗಲು ಇದು ಅತ್ಯುತ್ತಮ ಅನಿಮೇಷನ್ ಹೊಂದಿದೆ.

ಟೈಮ್‌ಲೈನ್

ಟೈಮ್‌ಲೈನ್

ಈ ಟೈಮ್‌ಲೈನ್ ಇರಿಸುತ್ತದೆ ಹಸಿರು ಬಣ್ಣದ ಉಚ್ಚಾರಣೆ ಸಂಪೂರ್ಣವಾಗಿ ಸ್ಥಿರವಾಗಿರಬೇಕು.

ಮತ್ತೊಂದು ಸಮತಲ ಟೈಮ್‌ಲೈನ್

ಮತ್ತೊಂದು ಟೈಮ್‌ಲೈನ್

ಅದು ಆಗಿರಬಹುದು ಚಿತ್ರವನ್ನು ಪೂರ್ಣ ಪರದೆಯ ಬಳಿ ಇರಿಸಿ ನೀಲಿ ಮತ್ತು ಬೂದುಬಣ್ಣದ ಬಳಕೆ ಮತ್ತು ಪ್ರತಿ ವರ್ಷ ಪ್ರತಿನಿಧಿಸುವ ವಲಯಗಳ ಸರಣಿಗಾಗಿ ಎದ್ದು ಕಾಣುವ ಟೈಮ್‌ಲೈನ್‌ಗಾಗಿ.

ಕಳೆದುಕೊಳ್ಳಬೇಡ CSS ಮತ್ತು HTML ನಲ್ಲಿ ಮೆನುಗಳ ಮತ್ತೊಂದು ಸರಣಿ.


ಲೇಖನದ ವಿಷಯವು ನಮ್ಮ ತತ್ವಗಳಿಗೆ ಬದ್ಧವಾಗಿದೆ ಸಂಪಾದಕೀಯ ನೀತಿ. ದೋಷವನ್ನು ವರದಿ ಮಾಡಲು ಕ್ಲಿಕ್ ಮಾಡಿ ಇಲ್ಲಿ.

ಕಾಮೆಂಟ್ ಮಾಡಲು ಮೊದಲಿಗರಾಗಿರಿ

ನಿಮ್ಮ ಅಭಿಪ್ರಾಯವನ್ನು ಬಿಡಿ

ನಿಮ್ಮ ಈಮೇಲ್ ವಿಳಾಸ ಪ್ರಕಟವಾದ ಆಗುವುದಿಲ್ಲ. ಅಗತ್ಯವಿರುವ ಜಾಗ ಗುರುತಿಸಲಾಗಿದೆ *

*

*

  1. ಡೇಟಾಗೆ ಜವಾಬ್ದಾರಿ: ಮಿಗುಯೆಲ್ ಏಂಜೆಲ್ ಗಟಾನ್
  2. ಡೇಟಾದ ಉದ್ದೇಶ: ನಿಯಂತ್ರಣ SPAM, ಕಾಮೆಂಟ್ ನಿರ್ವಹಣೆ.
  3. ಕಾನೂನುಬದ್ಧತೆ: ನಿಮ್ಮ ಒಪ್ಪಿಗೆ
  4. ಡೇಟಾದ ಸಂವಹನ: ಕಾನೂನುಬದ್ಧ ಬಾಧ್ಯತೆಯನ್ನು ಹೊರತುಪಡಿಸಿ ಡೇಟಾವನ್ನು ಮೂರನೇ ವ್ಯಕ್ತಿಗಳಿಗೆ ಸಂವಹನ ಮಾಡಲಾಗುವುದಿಲ್ಲ.
  5. ಡೇಟಾ ಸಂಗ್ರಹಣೆ: ಆಕ್ಸೆಂಟಸ್ ನೆಟ್‌ವರ್ಕ್‌ಗಳು (ಇಯು) ಹೋಸ್ಟ್ ಮಾಡಿದ ಡೇಟಾಬೇಸ್
  6. ಹಕ್ಕುಗಳು: ಯಾವುದೇ ಸಮಯದಲ್ಲಿ ನೀವು ನಿಮ್ಮ ಮಾಹಿತಿಯನ್ನು ಮಿತಿಗೊಳಿಸಬಹುದು, ಮರುಪಡೆಯಬಹುದು ಮತ್ತು ಅಳಿಸಬಹುದು.